自定义钩子上的 React useState 忽略提供的初始状态

Question

我根本不明白为什么会发生这种情况，甚至不明白如何解释它，我有这个自定义钩子：

const useFeatures = (existingFeatures: Ft[]) => {
    console.log('fts provided to state:', existingFeatures)
    const [features, setFeatures] = useState(existingFeatures)
    console.log('fts given by state:', features)

 ...

输出是

 LOG  fts provided to state: [{"done": true, "ftName": "task", "name": "T"}]
 LOG  fts given by state: [{"ftName": "number", "label": "N", "name": "", "value": 22}]

这种情况发生在使用 useFeatures 自定义钩子并提供不同“功能”（初始状态）的不同组件的渲染之间，就像 useState 正在缓存先前的状态，即使重新初始化也是如此。 我还应该澄清我正在开发一个 React Native 应用程序。 我知道没有太多信息可以发布问题，但我无法在项目之外重现该错误。 只是想知道是否有人经历过类似的事情。

我尝试在超时后运行第二个 console.log ，甚至在以参数为参数的 useEffect 挂钩中运行

[features]

仍然得到相同的日志

Answer 1

useState

钩子的默认值只是state的初始值。一旦您通过调用

setFeatures

更新状态，完全可以预期两个控制台日志将读取不同的值，直到卸载钩子为止。 （当然，除非使用初始值调用

setFeatures

）。