我有一个使用react hook api的问题
const Example: FC = (props) => {
const [str, setStr] = useState('example');
const onClickCb = useCallback(() => {
setStr(str + '_');
}, [str, setStr]); // should I need watch setStr?
return <button onClick={onClickCb}>{str}</button>;
};
最佳答案
不,您不需要添加setStr
,因为它在组件的生命周期内不会改变。但添加它也没有太大坏处,因为它不会改变。
Note
React guarantees that
setState
function identity is stable and won’t change on re-renders. This is why it’s safe to omit from theuseEffect
oruseCallback
dependency list.
但是你绝对应该删除str
。不应根据当前状态将状态更新为 react may batch multiple calls to setState
。这可能会导致短时间内发生的更新丢失。而是使用 setState
的回调版本:
const Example: FC = (props) => {
const [str, setStr] = useState('example');
const onClickCb = useCallback(() => setStr(current => `${current}_`)), []);
return <button onClick={onClickCb}>{str}</button>;
};
关于javascript - React Hook API,我是否需要为 SetStateAction 设置依赖?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55825495/