我有一个clearstate函数，它在单击restart按钮时将一些useState挂钩设置回它们的初始状态。 但是，他们说我的setState不是一个函数。 请检查以下代码:
app.js
...
const [question, setQuestion] = useState(0);
const [response, setResponse] = useState({});
const [answer, setAnswer] = useState({});
const [answerId, setAnswerId] = useState({});
...
modal.js
const Modal = ({
setResponse,
setAnswer,
setAnswerId,
setQuestion,
setAnswerNameArr,
}) => {
const [open, setOpen] = useState(false);
const clearState = () => {
setOpen(false); //works
setQuestion(0); //works
setAnswer({}); //does not work
setAnswerId({});
setResponse({});
setAnswerNameArr([]);
};
...
return (
<Modal
...
>
...
<Button
onClick={()=>handleSubmit()}
>
Restart
</Button>
</Modal>
);
};
export default Modal;
错误:
Uncaught TypeError: setAnswer is not a function
提前谢谢你。
看起来您没有将状态设置挂钩传递给
不管怎么说，这样做不是个好主意，TBH。 如果您需要一个子级来影响父级的状态，那么最好传递一个回调:
const Modal = ({
onSubmitCb
}) => {
const [open, setOpen] = useState(false);
const clearState = () => {
setOpen(false); //works
setQuestion(0); //works
onSubmitCb && onSubmitCb()
};
...
return (
<Modal>
...
<Button
onClick={()=>handleSubmit()}
>
Restart
</Button>
</Modal>
);
};
在你的父母身上:
const App = ()=>{
const clearState = () => {
setAnswer({});
setAnswerId({});
setResponse({});
setAnswerNameArr([]);
};
....
return {
<Modal ... onSubmitCb={clearState} />
}
}
