Question

我有一个数组，该数组创建带有复选框的项目映射。每个项目都有一个检查状态：

const [checked, setChcked] = React.useState(false)

因此，用户在20个复选框中选中了5个，然后按了一个按钮（该按钮位于较高的组件中，在该组件中有一个映射会使用复选框创建此项目），并且按预期工作。但是，在按下按钮且模态关闭后，再次打开模态后，这5个复选框仍处于选中状态。我希望它们重新启动以不受限制，就像刷新和状态消失时一样。现在，我知道了一些技术，例如不保存每个项目的状态，而只是将项目数组的状态保存在较高的组件中，但是我很困惑，因为我听说创建了挂钩，因此有时保存是一个好习惯哑组件状态。

有没有更简单的功能可以重新启动到初始值？

编辑：添加代码

           <div>
            {policyVersionItems.map(item=> (
              <PolicyVersionItem
                key={pv.version}
                policyVersionNumber={item.version}
                policyVersionId={item._id}
                handleCheck={handleCheck}
              >
                {' '}
              </PolicyVersionItem>
            ))}
          </div>

还有物品

const PolicyVersionItem: React.FunctionComponent<PolicyVersionItemProps> = props => {
const { , policyVersionNumber, policyVersionId, handleCheck } = props
const [checked, setChcked] = React.useState(false)
return (
    <Wrapper>
        <Label dark={isEnabled}> Version {policyVersionNumber}</Label>
            <Checkbox
                checked={checked}
                onClick={() => {
                    if (isEnabled || checked) {
                        setChcked(!checked)
                        handleCheck(policyVersionId, !checked)
                    }
                }}
            />
    </Wrapper>
)

}

其中一些不相关。句柄检查功能是例如将数据从下部组件返回到上部组件的功能。

如何在React Hooks中设置为初始状态

0 个答案: