我如何说服 babel 让我定义一个 Javascript 常量数组？

Question

我正在构建我的第一个 expo/react 应用程序。我在 App.js:

中不断收到“意外令牌”错误消息

export default class App extends React.Component {
   const [message, setMessage] = useState("...");

错误出现在行开头 const 的 [ 中。

据我所知，这是一个 babel 问题：此语法是在 ES2015 中引入的。 AFAICS，this should be resolvable 通过将 @babel/preset-env 添加到 babel.config.js 因此：

module.exports = function(api) {
  api.cache(true);
  return {
      presets: [
          '@babel/react',
          '@babel/env',
      ],
      plugins: [
          '@babel/proposal-class-properties',
      ],
  };
};

绑定成功，但错误依旧！我错过了什么？

Answer 1

该错误不是因为您通常尝试使用数组解构，而是因为您是在 class 的主体内执行此操作（您只能在其中声明属性）。

无论如何，React Hooks 只与 Function 组件兼容。您不能在 Class 组件中使用它们。

所以你需要使用函数组件语法。

const App = () => {
   const [message, setMessage] = useState("...");
   // ...
}

export default App;

进一步阅读：

Classes in JavaScript (MDN)
Function and Class Components (React)（简要总结）
React Component（API React 组件参考 class 定义）

我如何说服 babel 让我定义一个 Javascript 常量数组？

How do I persuade babel to let me define a Javascript array of consts?

javascript

reactjs

babeljs

expo