侦听器不会触发依赖数组的 useEffect

Question

这里的目标是在 Firebase 中修改数据时更改表格数据

问题是，由于某种原因，在侦听器firebase范围内，setState(...)不会触发具有适当依赖项的useEffect(()=> {}, [...])。

知道为什么，有没有办法强制改变？

const [actions, setActions] = useState([]);
....
firebase.
.firestore()
.collection("collection_name")
.onSnapshot(s => {
if (!s.empty) {
s.docChanges().forEach(change => {
if (change.type === "modified") { 
const newActions = [...actions, change.doc.data()]
setActions(newActions) //The change 
console.log("arrived here")
}...

。

useEffect(() => {
console.log("change in actions"); // Does not triggered on when modified
}, [actions]);

这在没有依赖数组的情况下确实有效：

useEffect(() => {
console.log("This does work")
});

Answer 1

我认为你应该看看你的其他参考资料。

使用 react hook 的事情是，如果 setter 之前和之后对象的引用相同，则侦听此对象的 useEffect 将不会触发。

这意味着，如果在newActions = ...中使用导致操作的引用来更新操作的值，然后 setActions(( 对象的引用保持不变，您应该尝试创建操作的副本，然后修改此独立副本。然后你可以设置操作(modifiedCopy(，这通常会触发useEffect。

注意：这只是一个猜测，因为我无法知道你在newActions = ...后面放了什么