react中关于hook介绍及其使用(7)
2023-06-22 来源:飞速影视
3. 注意:如果reducer hook的返回值与当前state相同,react将跳过子组件的渲染及副作用的执行
useCallback返回值:返回一个memoized回调函数,该回调函数仅在某给依赖项改变时才会更新。含义:把内联回调函数及其依赖项数组作为参数传入useCallback,它将返回该回调函数传递给经过优化的并使用引用相等性去避免非必要渲染useCallBack(fn, deps)相当与useMemo(() => fn,deps)useMemo使用方式:const memoziedValue = useMemo(() => computeExpensiveValue(a,b), [a, b])返回值:返回一个memoized值,把创建函数和依赖项数组作为参数传入useMemo,仅在某个依赖项改变时才重新计算memoized值。好处:这种优化有助于避免在每次渲染时都进行高开销的计算渲染方式:
传入useMemo的函数会在渲染期间执行,不要在这个函数内部执行与渲染无关的操作,如属于useEffect中的副作用。如果没有,那么新的值将会在每次渲染时被重新渲染注意:依赖项数组不会作为参数传递给函数,概述来说,就是每一个出现在函数中的参数也应该出现在依赖项的数组中useRef使用方式: const refContainer = useref(initialValue);返回值:返回一个可ref对象,其.current属性被初始化为传入的参数(initialValue)。这返回的的对象将在组件的整个生命周期中持续含义: useRef就像是一个盒子可以将.current中得可变属性给保存起来ref与useRef的区别在于,后者是创建的了一个普通的js对象,useRef和自建一个{current: …
。}对象的唯一区别是,useRef会在每次渲染时,返回同一个ref对象useImperativeHandle作用:可以在使用ref时自定义暴露给赋组件的实例值,使用的形式如下:
本站仅为学习交流之用,所有视频和图片均来自互联网收集而来,版权归原创者所有,本网站只提供web页面服务,并不提供资源存储,也不参与录制、上传
若本站收录的节目无意侵犯了贵司版权,请发邮件(我们会在3个工作日内删除侵权内容,谢谢。)
www.fs94.org-飞速影视 粤ICP备74369512号