react-redux 是推荐用传统的爷父子传参方式，还是 hooks 的方式发送 acton？
yazoox · 2020-11-19 13:53:29 +08:00 · 3189 次点击这是一个创建于 1500 天前的主题，其中的信息可能已经有所发展或是发生改变。
公司的项目，react, redux, + saga 的，三四年了。今年，开始，升级了 react 的版本，有人开始用 hooks 了。
于是我也跟风用 hooks，尤其是 useDispatch 。 这样，对于一些比较简单的组件，只发送一些比较简单的 action，我不用在 props 里面定义一堆 functions，然后通过 祖宗，太爷爷，爷爷，父亲把 具体的用户函数传递进来。可以直接在当前组件里面，就直接发送 actions 了。
结果，在代码审查时，有个人加注释说，让我不要用 useDispatch，改回传统的 react-redux 方式。
我特意去 google 搜索了一下，没有找到相关的讨论。在组件内，直接使用 useDispatch，然后发送 actions 的方法，不推荐么？
我的理解是，hooks 这一套，就是为了简化 /优化一些复杂冗余的调用。为啥这个不推荐用？是有什么说法么？
想来听听大家的意见
 |
1
liubiantao 2020-11-19 14:03:44 +08:00
参考官方指南 [Style Guide | Redux]( https://redux.js.org/style-guide/style-guide#use-the-react-redux-hooks-api )
|
 |
2
gouflv 2020-11-19 14:35:04 +08:00 via iPhone
跟 redux 说再见吧
|
 |
3
tonyYo 2020-11-19 15:04:54 +08:00
花了大力气弃用了 redux
|
 |
5
joesonw 2020-11-19 15:42:49 +08:00
爷父子传递的话还用什么 redux 啊.
|
 |
6
zqx 2020-11-19 16:09:40 +08:00 via Android
用 React 的 Context API 简单一些吧？
|
 |
7
baxtergu 2020-11-19 16:20:05 +08:00
你都用 saga 了就还是按照 saga 那套中心化 store 的模式来吧。如果想在组件内使用 hooks，那就在你的页面最外层包一层 conncect 把 dispatch 和 store 传进去（可以爷父子一层一层，也可以创建一个 context 直接隔着传下去），里面的消费组件只要写好 effect 处理好引用变更就好了。
|
 |
8
KuroNekoFan 2020-11-19 16:41:43 +08:00
我反正挺讨厌那种一板一眼的写法的，有的人喜欢
只能打一架了 |
|
9
KuroNekoFan 2020-11-19 16:43:43 +08:00
但是让不要用 useDispatch 明显就有问题了，hooks 出现的其中一个原因就是为了让人规避 connect 这种 hoc
|
 |
10
dartabe 2020-11-19 17:06:25 +08:00
别用 HOC 你每个模块还要写个连接完全是浪费时间
当然只是我的个人看法 希望有大佬来说说 |
 |
11
duan602728596 2020-11-19 17:56:53 +08:00
没啥说法，推荐使用 useDispatch
|
 |
12
matatabi 2020-11-19 18:29:00 +08:00
一直在用 dva,hooks 还没有用上
|
 |
13
nav4e 2020-11-19 18:35:17 +08:00
看起来主要还是为了区分 Container 和 Presentational 组件
展示组件不直接使用到 dispatch, 只响应 props 行为， 在代码大改动的时候， 只需要动到 Container https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0 如果是出现传递层级太深, 建议定好 context 的 api， 走 context |
 |
14
VDimos 2020-11-19 19:15:05 +08:00 via Android
都用过，还是回到 context 了，context 永远的神
|
 |
15
connection 2020-11-19 19:28:10 +08:00
用 redux 的一个好处就是规避多层级传递无用 props 吧
|
 |
16
weixiangzhe 2020-11-20 09:16:31 +08:00
redux 主要还是全局状态，我看很多人的时候，特别是配合 dva 用的时候，redux 只做数据载入用。我这个有个老项目用户数据通过 localStorage 存，所有接口都是 redux 走，头大的很。实际上大部分时候确实不需要 redux, 当前我们这边用 redux 或者全局状态的情景：
系统级需要用的数据，用户的基本信息，系统配置，ws 传过来的数据； |
 |
17
Qinmei 2020-11-20 10:30:04 +08:00
redux 的 useSelector 以及 useDispatch 就是给 hook 用的，如果你用 hooks 还要先 connect，那相当于不用啊
如果说直接用跟业务不太匹配，那也可以自行封装一套，redux 只是一种思想范式，如果连代码都要样板化，那才是真的限制死了 |
 |
18
xi_lin 2020-11-23 21:27:52 +08:00
CR 的时候那个人的理由是啥？
|
 |
19
yazoox OP |
|
20
nav4e 2020-11-25 11:19:54 +08:00
@yazoox 和 ls 说的 context api 一样
|--business_context.ts |--business page |- page-inside |- component-inside-inside 如在具体页面里头定好这个页面使用到的 context， 如 { create: () => dispatch('xx'), update: () => dispatch('xxx'), } 之后页面内的任意级组件使用 const { create } = useContext(business_context) 去调用。 具体权衡可以看 https://zh-hans.reactjs.org/docs/context.html context 这东西配合 ts 用起来会比较舒服 |
|
21
yazoox OP @nav4e thx.
其实，redux 操作对象也是 context，只是用它那套包装了一下。 不过，直接使用 context，能够减少 redux 的依赖。使得 component 看起来更像 dumb/pure component. 可惜，我们产品的架构已经定了。要么就是 props，mapStateToPros, mapDispatchToProps 。不允许直接使用自定义的 context...... |
Select Language