這是什麼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語法？

回答

相關問題