我真的很喜欢新的反应钩子 https://reactjs.org/docs/hooks-state.html我经常在我正在进行的项目中使用它们。我遇到了一种情况，我想使用上一个状态 in the useState钩子，但我不太确定如何做到这一点。
我尝试过类似的方法，但无法编译。
const [ someState, setSomeState ] = useState( new Map() )
setSomeState( prevState.someState.set( key, value ) )
（顺便说一句，这是映射复选框数组以跟踪已标记的复选框）
我正在尝试遵循这个例子here https://medium.com/@wlodarczyk_j/handling-multiple-checkboxes-in-react-js-337863fd284e，但不使用setState功能。
谢谢您的帮助！
对于对象，您可以使用扩展运算符来使用prevState在你的setState call.
const [object, setObject] = useState({
firstKey: '',
secondKey: '',
});
setObject((prevState) => ({
...prevState,
secondKey: 'value',
}));
// object = {
// firstKey: '',
// secondKey: 'value',
// }
下面的代码片段显示了使用的示例prevState用于设置对象的状态。
const {useState} = React;
const Example = ({title}) => {
const initialState = {
firstKey: 'empty',
secondKey: 'empty',
thirdKey: 'not empty',
}
const [object, setObject] = useState(initialState);
const withPrevState = () => {
setObject((prevState) => ({
...prevState,
secondKey: 'not empty',
}));
}
return (
<div>
<h5>Updates Second key to 'not empty'</h5>
<p>First key: {object.firstKey}</p>
<p>Second key: {object.secondKey}</p>
<p>Third key: {object.thirdKey}</p>
<button onClick={withPrevState}>
Update with prevState
</button>
<button onClick={() => {setObject({secondKey: 'not empty'})}}>
Update without prevState
</button>
<button onClick={() => {setObject(initialState)}}>
Reset
</button>
</div>
);
};
// Render it
ReactDOM.render(
<Example />,
document.getElementById("react")
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.4/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.4/umd/react-dom.production.min.js"></script>
<div id="react"></div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
