是否可以为地图中的每个元素定义一个状态？答案

【问题标题】：Is it possible to define a state for every element in map?是否可以为地图中的每个元素定义一个状态？
【发布时间】：2022-01-04 18:14:56
【问题描述】：

映射后我在定义状态时遇到了困难。它说（不能在回调中调用 React Hook “useState”。必须在 React 函数组件或自定义 React Hook 函数中调用 React Hooks）。

【问题讨论】：

请将代码sn-p添加到您的问题中，以便我们更正，如果有需要更正的地方。
您绝对应该发布一些代码，但从您的问题来看，useState 提供了 setter 函数（即const [state, setState] = useState(initialValue);。您不应该在地图函数回调中调用useState，您应该打电话给setState(value)。

标签： javascript reactjs

【解决方案1】：

有办法做到这一点。地图的每个元素都可以由一个组件表示，因此您只需在此组件中设置一个状态：

const Parent = () => {
  const data = [
                 {firstname: 'Quentin', lastname: 'Smith'},
                 {firstname: 'John', lastname: 'Doe'}
               ];

  return (
    <>
     {data.map(element => <Child myProp={element} />)};
    </>
  )
}



const Child = ({myProp}) => {
  // Do whatever you want with the state
  const [myState, setMyState] = React.useState();

  return <div>firstname = {myProp.firstname}, lastname = {myProp.lastname}</div>; 
}

【讨论】：

【解决方案2】：

您无法在映射时定义状态。因为它违背了在 react 中定义状态的角色。

您始终应该遵循在文件顶部定义状态的方式。

此外，如果您在文件顶部定义状态并在循环中设置您想要的状态之后会更好。这种方法比较好用

【讨论】：