react useCallback(记忆函数）用法

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

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