搞不明白 React Hooks,有没有兄弟分享一下经验?

2020-10-13 09:35:36 +08:00
 yazoox

公司产品一直用的是 react-redux 做状态管理,用 saga 处理异步。

升级到了 16.8,听说有个 hooks,很方便。

看了官方文档,也搜索了一下,还是搞得不是很明白。

大家有没有看到比较好的文档 /文章,详细介绍分享这个 react hooks 的?求分享指点。谢谢。

另,这个 hooks 比 redux 好用么?能够取代 redux & saga 么?

6341 次点击
所在节点    React
31 条回复
jianzhang810
2020-10-13 09:40:26 +08:00
VDimos
2020-10-13 09:42:18 +08:00
推荐个 lib,react-uses,看下会对 hooks 有更深的理解
easonHHH
2020-10-13 09:45:45 +08:00
hook 是取代 class 的吧,两者应该会长期共存一段时间,不过有 useReducer
倒是官方出了一个对标 redux 的 recoil
azcvcza
2020-10-13 09:55:27 +08:00
murmur
2020-10-13 10:01:17 +08:00
hook 和 class 是两种写法,思路是有变化的,我认为 hook 本质上解决的是 react api 又长又臭的问题,不是说 hook 就比 class 优越,该设计一样得设计,以前考虑生命周期,现在直接考虑变量,该优化还是得优化,该不管还是可以不管
gouflv
2020-10-13 10:02:07 +08:00
redux 解决的是状态管理和共享,而 hooks 只是状态管理,不涉及如何共享数据,所以你说怎么取代?
看文章自己要动脑,一知半解的时候不要瞎幻想
wee911
2020-10-13 10:28:18 +08:00
@gouflv hooks 组合能解决共享问题, 多数场景没有用 redux 必要,hooks 一套带走
Wolther47
2020-10-13 10:30:01 +08:00
这是两个东西,屑屑。

Hooks 介绍文档里面就有当时 Conf 的视频,建议看一遍,两段都是关于 migrating from class components to hooks 的,看完就知道 useState 、useEffect 和 useContext 了,基本可以搬砖了
KuroNekoFan
2020-10-13 10:30:56 +08:00
其实 hooks 有点像 vue 的 mixin,当然,好很多
KuroNekoFan
2020-10-13 10:32:08 +08:00
自定义 hook 和 react 原本提供的 hooks 应该区分来看待,自定义 hook 可以看作一段逻辑,而 react 本身提供的 hooks 是为了解决副作用的
yaphets666
2020-10-13 10:34:19 +08:00
@KuroNekoFan 这俩东西没什么相似之处吧...
Wolther47
2020-10-13 10:35:00 +08:00
@gouflv #5 Hooks 不是为了解决状态管理的。这东西纯粹就是当时往 Class Component 走的方向错了,再引入的改进办法。Hooks 主要目的是解决逻辑复用和业务逻辑分裂的,Vue 那难产了几年的 3 也在想办法解决这个问题。
nanyang24
2020-10-13 10:41:25 +08:00
探索有关 Algebraic Effects 的概念,应该会有启发
codelegant
2020-10-13 10:52:32 +08:00
Hanggi
2020-10-13 10:54:32 +08:00
hooks 核心思想就是去掉 class 所有东西都用 function 替代.
codelegant
2020-10-13 10:55:07 +08:00
附上作者的 Github 主页 https://github.com/gaearon
gouflv
2020-10-13 10:58:03 +08:00
redux 就算对标,也是应该和 unstated 和 constate 这些去对
KuroNekoFan
2020-10-13 11:00:05 +08:00
@yaphets666 自定义 hooks 是为了逻辑复用,mixin 也是为了逻辑复用
cityboy
2020-10-13 11:08:27 +08:00
以前用 react-redux 共享全局变量。hooks 里面建议用 useContext 这种,但是我一直不会用这种方式,而且用着感觉很麻烦。各位大佬有最佳实践,可以让小弟观摩观摩
KuroNekoFan
2020-10-13 11:14:16 +08:00
@cityboy 接着用 react-redux 没毛病,可以看看 react-redux 新提供的 api:useDispatch 和 useSelector

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/714379

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX