React 中的類

Question

我在我的 HTML 文件中使用反應類。 如果我在 class 構造函數中有 this.state ，那么一切正常。 但是如果我想在 state= {key: value, key2: value2...} 之類的構造函數之外執行它，它就行不通了。 實際上，似乎除了我的 class 內部的方法（在構造函數之外）之外，我什么都不能使用。它給出了“意外的令牌”，並在賦值運算符“=”下面放了一個小箭頭。 當我使用 create-react-app 時，所有問題 go 都消失了，所以我很好奇為什么在 HTML 內部引用會導致這種情況？

Answer 1

你正在嘗試使用 class 屬性，它還不是 javascript 的一部分，你可以安裝一個 babel 插件來啟用這個功能。 只需運行

npm install @babel/plugin-proposal-class-properties

然后將其添加到 your.babelrc 配置文件中，使其看起來像這樣

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react"
    ],
    "plugins": [
        "@babel/plugin-proposal-class-properties"
    ]
}

注意：如果您使用 CDN 而不是構建工具，例如 webpack，那么您應該使用babel-standalone CDN 而不是 babel-core，如下所示：

<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

create-react-app 安裝了這個插件，這就是為什么當你使用 create-react-app 生成一個 react 應用程序時它可以為你工作。