react useCallback notice

Posted nyan-workflow-fc

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了react useCallback notice相关的知识,希望对你有一定的参考价值。

多个不同输入框共用一个方法时使用useCallback:

params = initParams = {code: "code_test", name: "name_test"}

const onInputChange = React.useCallback((e: React.ChangeEvent<htmlInputElement>) => {
        setParams({
            ...params,
            [e.target.name]: e.target.value
        });
    }, [params]);

useCallback 如果没有写以来state变化参数(如上:params),调用时改变target.value, 设置其他params参数为初始化参数,

改变code为 “1”, 改变name时,设置name为新值,同时code会变为初始值"code_test",而不是为1.

以上是关于react useCallback notice的主要内容,如果未能解决你的问题,请参考以下文章

使用 React.memo、useCallback、useMemo 防止对象重新渲染

React - 无法在 usecallback 函数中调用道具值

javascript React Hooks useMemo useCallback

React Hooks useCallback 的简单示例的问题

我们应该在 React 功能组件的每个函数处理程序中使用 useCallback

React性能优化之memo,useMemo,useCallback的使用与区别