来简单聊一聊React Hooks

为什么会有Hooks?
大家都知道React的组件创建方式,一种是类组件,一种是函数式组件,在React官方希望,组件不要变成复杂的容器,只做数据流。开发者只根据需求,组合即可。也就是说组件的最佳写法应该是函数,而不是类。其实我们知道,在实际开发项目中类组件纯函数组件的区别是很大的,纯函数组件有着类组件不具备的多种特点,简单比如:
1、纯函数组件没有状态

2、纯函数组件没有生命周期

3、纯函数组件没有this

4、只能是纯函数
从上可以看出我们所推崇的函数组件,只能做UI展示的功能,涉及到状态的管理与切换,我们不得不用类组件或者redux,但我们知道类组件的也是有缺点的,在项目开发中遇到简单的页面,你的代码会显得很臃肿,并且每创建一个类组件,都要去继承一个React实例,至于Redux,更不用多说,很久之前Redux的作者就已经说过,“能用React解决的问题就不用Redux”,等等一系列的话。

那什么是Hooks?,'Hooks'的单词意思为“钩子”。

React Hooks 的意思是,组件尽量写成纯函数,如果需要外部功能和副作用,就用钩子把外部代码"钩"进来。而React Hooks 就是我们所说的“钩子”。
下面是React为我们提供的默认的四种最常用钩子

1、useState()

2、userContext()

3、userReducer()

4、useEffect()

至于用法、我就不细说了,你们就自行百度或者参考官方对应的api吧.........

关于React Hooks的理解,它为我们带来了React翻天覆地的变化,也让我们感受到了React的未来,不过,假如你不会Hooks也是没有关系的。根据官方文档的话来说:

1、完全可选的。
你无需重写任何已有代码就可以在一些组件中尝试 Hook,但是如果你不想,你不必现在就去学习或使用 Hook。

2、100% 向后兼容的。
Hook 不包含任何破坏性改动,Hook 已发布于 v16.8.0。

3、没有计划从 React 中移除 class。

4、Hook 不会影响你对 React 概念的理解。
Hook 为已知的 React 概念提供了更直接的 API:props, state,context,refs 以及生命周期。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容