Javascript 使用React-useEffect挂钩仅对某些依赖项运行效果？

这里的反应相当新鲜。 在这种情况下，回调中引用了2个值。我只希望在第一个值更改时执行回调。因为我引用了第二个值，所以它仍然需要在dep数组中；但是，我不希望每次第二个值更改时都执行回调，因为它在我的代码中毫无意义

useEffect(()=> {
  // Do something with val1 and val2
}, [val1, val2]);

处理这种情况的最佳方法是什么

我知道useReducer存在，但我还没有学会，我不确定这是否是我问题的解决方案

更新

---

我还知道，如果我的val1没有改变，我可以在回调中添加一些逻辑以提前返回，但我只是想知道最好的方法是什么。

将数组传递给

useffect

作为

useffect（回调，数组）

并不意味着您正在使数组的元素在回调的范围内可用。这些变量已经可用于useffect中声明的回调。

数组的元素

仅用于控制

回调

是否会在重新渲染时触发。在这方面，你将实现你想要的行为，就像这样

useffect（（）=>{
//val 1和val 2已在范围内
//用val1和val2做点什么
}，[1]）；

---

上述效果仅在

val1

更改时执行回调

因为您提到

val1

和

val2

是状态变量，我建议

useReducer

。根据经验，如果您需要在一个原子操作中操作多个状态变量，请通过

useState

实现这一点。从

当您有涉及多个子值的复杂状态逻辑时，useReducer通常比useState更可取

您可以使用

useReducer

这样管理组件

const[state，dispatch]=useReducer（（state，action）=>{
如果（action.type=='changeVal1'）{
返回{…状态，val1:action.val1}
}
返回状态
}，{val1:'某物'，val2:'另一物'}）
useffect（（）=>{
常数{val1，val2}=state
//用val1和val2做点什么
}，[state.val1]）；
//组件中的其他地方。。。
分派（{type:'changeVal1'，val1}）

考虑使用两个

useffect

s，从第一个中删除

val1

，从第二个中删除

val2

？我需要在一个API调用中使用这两个值。我有类似的情况，问题似乎出在我的状态设计中——依赖项中有两个变量有问题吗？能否添加完整组件的代码？能否详细说明

val

和

val2

是什么？另外，你能详细说明一下你想在效果中做的

事情吗？如果你在
useffect
中使用
val2
，这会导致bug。@evolutionxbox怎么会这样？这不是范围的问题，而是设计良好的功能组件和状态的问题。您的代码将从React生成警告，因为您使用的变量不在Dependencies数组中。正确，但我在回调中使用val2，因此React警告我将其放入dep数组，因为如果我不这样做，一旦val1发生更改，我将引用过时的val2。至少我是这样理解的。@richytong和
作为经验法则，如果在一个原子操作中需要操作多个状态变量，请使用这个over-useState
->或者它是一个指示，表明两个状态变量应该合并到一个对象中。我认为这更多的是一种观点，而不是一条一般规则--

涉及多个子值的复杂状态逻辑->他的情况看起来相当简单，而一个减缩器看起来有些过分，因为只有一个可能的操作