【react 基础篇】什么情况下， 需要加入useEffect 的依赖项？

先看例子：

store.ts
openIndex:{}, 
setOpenIndex:(index)=>set(state=>({ 
    openIndex:{ ...state, [index]: !state.openIndex[index] 
},
setNavIndex:(index)=>set({navIndex: index})

index.tsx

useEffect(()=>{ 
    if(selectMenu){ 
        setOpenIndex(true); 
        setNavIndex(selectMenu?.key) 
    }
},[selectMenu, setOpenIndex, setNavIndex]) 

那么，请问上述依赖项中， setOpenIndex 跟 setNavIndex 是从store.ts 中获取的，需要加入依赖项 么？

在这种情况下，setOpenIndex 和 setNavIndex 是从 store.js 中获取的，并且这些函数可能是动态创建的或可能会更新。因此，为了确保 React 在这些函数引用发生变化时能够重新执行 useEffect，最好将它们添加到依赖数组中。

如果你的 Zustand store.js 确保了这些函数引用始终是稳定的（不会改变），理论上可以省略它们。但从 React 最佳实践角度考虑，将它们加入依赖项可以确保代码的健壮性和可维护性。

因此，结论是：需要将 setOpenIndex 和 setNavIndex 加入依赖项。

如果，

onst [openIndex, setOpenIndex] = useState(false); 
const [navIndex, setNavIndex] = useState(string);

在这种情况下，setOpenIndex 和 setNavIndex 是 React 的 useState 钩子返回的 setter 函数。这些 setter 函数在 React 的生命周期中是稳定的，也就是说，React 保证它们的引用不会在重新渲染时发生变化。

因此，不需要将 setOpenIndex 和 setNavIndex 加入依赖项数组。你只需要在依赖项数组中加入那些可能会发生变化的值，例如 selectMenu。