反应中的意外标记

Question

我得到了以下错误：

events.js:72
        throw er; // Unhandled 'error' event
              ^
SyntaxError: /vagrant/resources/assets/js/react/react_app.js: Unexpected token (366:10)
  364 | var InvestorsTable = React.createClass({
  365 | 
> 366 |     mixins: [Polling, StateHandler, ComponentBase],
      |           ^
  367 | 
  368 |     render: function() {
  369 |         return(
    at Parser.pp.raise (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13)
    at Parser.pp.unexpected (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:82:8)
    at Parser.pp.expect (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:76:33)
    at Parser.pp.jsxParseExpressionContainer (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:301:8)
    at Parser.pp.jsxParseElementAt (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:370:30)
    at Parser.pp.jsxParseElementAt (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:362:30)
    at Parser.pp.jsxParseElement (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:398:15)
    at Parser.parseExprAtom (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:410:21)
    at Parser.pp.parseExprSubscripts (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:236:19)
    at Parser.pp.parseMaybeUnary (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:217:19)

此错误由以下代码造成：

var InvestorsTable = React.createClass({

    mixins: [Polling, StateHandler, ComponentBase],

    render: function() {
        return(
            <Table data={this.state.data} />
        );
    }
});

这是如何无效的语法？我的“意料之外的标记”呢？我还有一节课：

var CapitalRaised = React.createClass({

    mixins: [Polling, StateHandler, ComponentBase],

    ...

});

该类在上述类的之前编译和编译的时不会抛出错误。就像我不知道出了什么问题.

Answer 1

在该类之上的文件中，在上面有一个未关闭的JSX元素父元素。由于您还没有显示完整的代码，下面是一个示例。

var CapitalRaised = React.createClass({
  render(){
    return (<div>);
  }
});

var InvestorsTable = React.createClass({

  mixins: [Polling, StateHandler, ComponentBase],

  render: function() {
    return(
      <Table data={this.state.data} />
    );
  }
});

<div>元素未关闭。这将引发Unexpected token (9:8)，因为JSX采用<div> ... { mixins: [Polling的形式，而在JSX中，{}中的内容应该是JS表达式，而mixins:不是表达式的有效开始。