快来加入我们吧!
"小和山的菜鸟们",为前端开发者提供技术相关资讯以及系列基础文章。为更好的用户体验,请您移至我们官网小和山的菜鸟们 ( https://xhs-rookies.com/ ) 进行学习,及时获取最新文章。
"Code tailor" ,如果您对我们文章感兴趣、或是想提一些建议,微信关注 “小和山的菜鸟们” 公众号,与我们取的联系,您也可以在微信上观看我们的文章。每一个建议或是赞同都是对我们极大的鼓励!
自定义 hook
官方文档在讲自定义 hook时,给了一个好友状态的例子,但是例子较为复杂,难懂。在这里我们用一种更简单的方式,教您学会自定义 hook。
什么是自定义 hook
当我们想在两个函数之间共享逻辑时,我们会把它提取到第三个函数中。而组件和 hook
都是函数,所以也同样适用这种方式。
自定义 Hook 是一个函数,其名称以 “use
” 开头,函数内部可以调用其他的 hook
与组件中一致,请确保只在 自定义 hook 的顶层无条件地调用其他 hook
一个简单的自定义 hook 案例
使用一个最简单的代码来了解一下自定义 hook
import {
useState } from 'react'
const useMyHook = (initValue) => {
const