对useCallback官方例子的不理解?

不理解官方的一个faqlink
Ifthefunctionyou’rememoizingisaneventhandlerandisn’tusedduringrendering上边这句话是官方的原话,但我觉得没什么道理...
在我看来下面两种写法没有任何区别,请指点;
importReact,{useState,useCallback,useEffect,useRef}from'react';
functionForm(){
const[text,updateText]=useState('');
consttextRef=useRef();
useEffect(()=>{
textRef.current=text;//Writeittotheref
});
consthandleSubmit=useCallback(()=>{
constcurrentText=textRef.current;//Readitfromtheref
console.log(currentText);
},[textRef]);//Don'trecreatehandleSubmitlike[text]woulddo
//consthandleSubmit=useCallback(()=>{
//console.log(text);
//},[text]);
return(
<>
updateText(e.target.value)}/>
click
);
}
exportdefaultForm;
ABOUTYOU
浏览 1654回答 2
2回答

潇潇雨雨

useCallback的依赖是只比较值的,如果是对象,就是只比较引用而textRef是一直存在不会销毁的跨生命周期对象,引用一直不变,so,相当于,useCallback的依赖为[]ps:为什么只比较引用呢,我觉得,因为useCallback/useEffect的依赖里基本都该是useState的返回值,而每次调用setState都会赋给state一个全新的值,如果是对象,引用就变了,so,只需要比较值(对象的话是地址)就知道依赖有没有变化

慕丝7291255

简单来说就是这样写效果一样,但是性能更好。官方原文:WrapwithuseCallbacktoavoidchangeoneveryrender
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript