这是什么JavaScript ES6语法？

学习反应，我期待在谷歌的MaterialUI文档，它显示了一个语法看起来像：这是什么JavaScript ES6语法？

ERROR in ./client/App.jsx 
Module build failed: SyntaxError: Unexpected token (23:8) 

    21 | } 
    22 | 
> 23 | state = { 
    |  ^
    24 |  open: false, 
    25 | }; 
    26 |

：

export default class DialogExampleModal extends React.Component { 
    state = { 
    open: false, 
    }; 

    handleOpen =() => { 
    this.setState({open: true}); 
    }; 
...

巴贝尔与ES2015是在这段代码的状态=部分失败

我的问题是，这是什么语法，我有可能配置错误的东西？看来其他ES2015语法工作正常。

来源

2017-04-19 Krum

您在第21行缺少分号。 – cdhowie

我认为你要么需要设置这样的构造函数中的类的属性：

export default class DialogExampleModal extends React.Component { 

    constructor() { 
    this.state = { 
     open: false, 
    }; 

    this.handleOpen =() => { 
     this.setState({open: true}); 
    }; 
    } 

}

，或者您可以使用transform-class-properties通天插件，从你的问题编译使代码。

来源

2017-04-20 00:10:53 TeWu

transform-class-properties是缺少的插件。 – Krum

请注意，在提及'transform-class-properties'之前，我已经用构造函数展示了解决方案，因为'transform-class-properties'目前仅仅是一个[阶段2中的提议]（https://github.com）/tc39/proposal-class-public-fields） - 所以这个语法根本不稳定。在教程中使用它是完全可以的，但是在生产代码中使用它之前可能会想到它。你也应该upvote你喜欢的答案。 – TeWu

那么，跳转到我的第一件事是示例代码在状态代码之前有一个开放大括号，而您的代码有一个右括号。

export default class DialogExampleModal extends React.Component { // HERE 
    state = { // HERE 
    open: false, 
    }; 

    handleOpen =() => { 
    this.setState({open: true}); 
    };

和你：

21 | } // HERE 
    22 | 
> 23 | state = {

如果你的状态函数之前关闭部分，因为这是它不希望在组件外未定义功能就会抛出一个错误。

如果这是组件内的另一个函数，那么在它之后需要一个分号。

21 | }; // SEMICOLON HERE 
    22 | 
> 23 | state = {

来源

2017-04-19 23:57:50

这是什么JavaScript ES6语法？

回答

相关问题