将setState（useState钩子）与对象状态或状态变量一起使用

Question

我好奇的一件事是我找不到很好的答案。

当我在我的功能组件中更新状态时，下面的示例将在下面的示例中对其进行更新，这在钩子的介绍中现在几乎全部使用：<{1}}被调用时。< / p>

setScreenIsFocussed

现在，每次我在功能组件上调用const [screenIsFocussed, setScreenIsFocussed] = useState(false); ... useFocusEffect( useCallback(() => { setKeyInView('someKey') setScreenIsFocussed(true) return () => { setKeyInView(null) setScreenIsFocussed(false) } }, [navigation, screenIsFocussed]) ); 挂钩时，它都会重新渲染，因为（显然）它的状态正在改变。上面的代码在同一函数调用中更改了状态，因此将导致两次重新渲染。最好将这些元素归为功能组件的一个状态变量，以减少重新渲染的总体需求，例如：

setState

，然后以相同的方式更新：

const [state, setState] = useState({ 
                                      keyInView: null, 
                                      screenIsFocussed: false 
                                   })