关于react.js:React-Hook-常用的钩子

偶然看见一篇 React hook 的罕用钩子，看见了几篇文，大略晓得了如何用，和其中的含意，然而还未实际，将尽可能使用到下一个需要，在来欠缺实现逻辑局部，先记录一下含意，以便查找。

哈哈哈哈哈，未完待续。

useState 和 class 中的 state 一样，存入变量扭转，界面从新渲染的值。
注：

在查看谋篇 typescript 代码标准时，有多少 state 值时，应用多个 useState，尽量将多个变量，应用对象的模式，合并成一个。
如果须要应用 state 简单的场景时，尽量应用 useReducer 来代替 useState。

当 state 简单时，有多个不同状态时，将会应用 useReducer，和 react 中的 redux 相似。

useEffect 将能够模仿 react 中的 componentDidMount，componentDidUpdate，componentWillUnmount。

useEffect(()=>{// 这个相当于 componentDidMount},[])

ueEffect(()=>{// 这个相当于 componentWillUnmount},[])

ueEffect(()=>{
    // 这个相当于 componentDidUpdate
    // 当 changeValue 扭转时触发
},[changeValue])

这个能够缓存函数，应用 React Hook 有时候会反复定义函数，当应用 useCallback 包裹次函数，会产生缓存，因而不会反复定义。如果在父组件定义的函数，将函数传入子组件。那么次函数必须要被 useCallBack 包裹。否则父组件每次渲染会使子组件渲染，因为子组件认为这个函数扭转了。

能够获取 Dom，并且操作 Dom。

能够应用 useref 拜访 dom
能够和 React.forwardRef 一起应用获取自定义组件的 Dom，自定义组件须要被 React.forwardRef 包裹。

包裹在组件里面，通过对 props 进行浅比拟，缩小渲染，进步性能，这个要和 useCallBack 来包裹函数，配合应用。

应用 React。creatContext 包裹在父组件外，应用 useContent 在子组件，或者孙子组件，等等等，来回去传入的值，不须要通过 props 一层一层传。

能够使父组件调用子组件暴露出的办法和属性。

当 dom 更新后，会同时登程执行该函数，会阻止浏览器的渲染，等改函数执行之后，将一起渲染界面，会产生视觉阻塞，尽量应用 useEffect 代替。

useLayoutEffect 和 useEffect 的区别。
useMemo
useCallbcak
useRef

本文记录一下本人在文中所看到内容，因为未实际，没有贴代码，将会在实际后补全，如有有余，欢送指出。

对于这个好文章：
https://juejin.cn/post/689596…

关于react.js:React-Hook-常用的钩子

前言

罕用的钩子

useState

useReducer

useEffect

useCallback

useRef

useMemo

useContext

useImperativeHandle

useLayoutEffect

面试常考

总结