导入中使用State

Question

当我在 App.js 中使用 useState 时，出现错误，提示“无法在顶层使用 useState”。

我在 src 文件夹中创建了一个名为 Box.js 的组件，其中包含一个包含 6 个对象的数组，每个对象都有两个属性； id 和 On（带有布尔值）。然后我将组件导入到由 Index.js 渲染的 APp.js 中。我导入了 useState“import React, {useState} from 'react';”，然后用状态 const“[boxes, setBoxes] = useState(Box);”创建了状态。创建状态后，我通过 Box.js 数组映射为“const boxElements =boxs.map((box) => {

})"。我的期望是将数据从 Box.js 传递到 App.js 作为状态，但我收到了错误。

Answer 1

React hooks 只能在组件内部使用。至于你提供的代码，不是。

尝试函数 App 内的 useState 挂钩。