Reactjs 使用useCallback从useState发送setState作为道具

我的组件中有下一个状态

const [value, setValue] = useState(0);

在这个组件中，我还有另一个组件作为子组件：

<Child setValue={setValue} />

您如何注意到我将

setState

作为道具发送到那里。

---

问题：如何在

useCallback

钩子中包装此

setState

，然后在

中将其作为道具传递
我想这样做是为了优化组件，尤其是避免子组件重新渲染。

为了查看道具，您必须安装扩展。在use回调中不需要包装setState，因为React不会更改hook setState

---

另一方面，我认为您必须传递setValue，而不是setState

假设setState是您定义的函数

const [value, setValue] = useState(0):
const setState = useCallback((newValue) =>{
    setValue(newValue)
},[all the dependencies for the function above])

return(
   <Child
      setValue={setState}
   />
)

const[value，setValue]=useState（0）：
const setState=useCallback（（newValue）=>{
设置值（新值）
}，[上述函数的所有依赖项]）
返回(
)

---

还有一件事，不要在依赖数组中传递函数，它会对性能产生负面影响

你是说

setValue={setValue}

？@pmiranda，是的，我改变了关于该语句的任何来源？我的IDE（webstorm）总是建议我添加每个依赖项，包括我将在useEffect中使用的函数。我会尝试找到一些东西，但原因是javascript每次都会创建函数的新实例，因此useCallback会再次创建你记忆函数的新实例。但是如果你想让一个函数在依赖数组中，也可以将该函数包装在useCallback中。事实上，这是useCallback的一个用例，如果你想将一个函数作为依赖传递给useEffect/useCallback（或其他任何东西），你可以将该函数包装在useCallback中，以防止额外的重新加载。检查这个@pmirandaOP询问关于包装状态设置器函数的问题，该函数由

useState

hook返回，带有

useCallback

hook。React保证状态设置器函数的标识始终是稳定的，因此不需要将其包装在

useCallback

钩子中。