主页 > 电脑硬件  > 

reactuseCallback(记忆函数)用法


//定义:防止组件重新渲染,导致方法被重新创建,起到缓存作用,只有第二个参数变化,才重新声明一次。

import React, { useCallback, useState } from 'react'

  const [text,settext] = useState("");

export default function App() {

  const handleChange = useCallback(

    (evt) =>{

      settext(evt.target.value);

     },

     [text]

  )

  return (

    <div>

      <input onChange={handleChange} value={text}></input>        

</div>

)

}

//只有text改变后,这个函数才会重新声明一次

//如果传入空数组,就是第一次创建后被缓存,即使后期name改变了,拿到的还是老的name

//如果不传第二个参数,每次都会重新声明一次,拿到的是最新的name

标签:

reactuseCallback(记忆函数)用法由讯客互联电脑硬件栏目发布,感谢您对讯客互联的认可,以及对我们原创作品以及文章的青睐,非常欢迎各位朋友分享到个人网站或者朋友圈,但转载请说明文章出处“reactuseCallback(记忆函数)用法