useSingle(自定义hook)

• 只执行一次的勾子

  import {useRef} from 'react'
   
  export const useSingle = (callback) => {
  	const flag = useRef(false)
  	if (flag) {
  		return
  	}
  	callback()
  	flag.current = true
  }

  useSingle与useEffect的区别是：

  • useEffect是渲染之后才运行。
  • useSingle是函数运行的时候就执行。

• 使用

  import { useSingle } from './hooks'
   
  export const Count = () => {
  	useSingle(()=>{
  		console.log('只执行一次')
  	})
  	// ...
  	return <Child />
  }