举例一个场景
上面是一堆的开关过滤器, 输出一堆参数给 Data 过滤
<FilterArea/>
下面是一个 table 展示数据
<DataArea/>
- 要么在 FilterArea 里面做状态提升
- 要么在 FilterArea 里面做 useContext ？
这种会影响代码可读性吧，毕竟 FilterArea 比较偏 UI，可能写在各种表现形式上
- 要么用 redux 写一大堆各种 types, actions, reducers
› React
This topic created in 1901 days ago, the information mentioned may be changed or developed.
 |
1
这种不算父子组件传值，算是兄弟组件传值？
|
|
2
redux 还有一个问题是全局数据。就意味着你有多个比较相似的 Filter 的时候，用一套 type&reducers 就会互相污染，用多套，代码就写恶心了。
感觉这种更类似于上下文数据，应该用 Lifting State Up |
 |
walpurgisAug 20, 2021 via iPhone
3
兄弟组件共享显然是把状态提升到父级
|
 |
statumerAug 20, 2021 via Android
4
状态提升，这个业务建议别写 redux 写 mobx，别和自己过不去
|
 |
5
99%的项目不需要 redux，useContext 足够了。有机会做那 1%的人也不会来问这种问题。
所以，若非接手现有的代码，不要考虑 redux，开发速度慢，运行速度慢，太重了 |
2 |
XTTXAug 20, 2021
6
1.除非参数在 app 各个地方都有用到， 不然 props 传输就是最好的办法。
2.如果<DataArea/>的所需参数除了<FilterArea/>能输出，还有其他地方也能输出，props 也是最好的办法。 |
 |
wuchangming89Aug 20, 2021
7
@statumer，同意，写业务项目直接 Mobx，业务与 UI 分离，MVVM 效率也高。如果写开源库组件库什么的另说
|
 |
dcalskyAug 20, 2021
8
其实 mobx 写起来也蛮快的，编码效率跟 useContext 差不多，关键是还不用自己填一堆坑。
|
 |
zoeliuAug 20, 2021 via Android
9
状态提升 context 就可以。最近有复杂度不高的项目涉及全局状态传递使用的 useContext + useReducer 。
|
 |
sekiAug 20, 2021
10
recoil 或者 jotai
|
 |
GuguDanAug 20, 2021
11
Stook
|
 |
bnm965321Aug 20, 2021
12
recoil 谁用谁知道
|
 |
hingleAug 20, 2021
13
recoil + 1
|
 |
PeakFishAug 20, 2021
14
|
|
wuchangming89Aug 20, 2021
15
eventBus 和 redux 这些全局变量类的数据管理方案，模块化都不好做，命名空间约定也是麻烦事。如果大项目或者多人合作项目，模块化还是挺重要的。小项目除外，小项目上面说的什么都行。
|
 |
ZZITEAug 20, 2021
16
recoil + 1
|
 |
prayxAug 20, 2021
17
推荐个冷漠的库 constate：
将自定义 hooks 提升到 context 特别简洁优雅 |
|
RocketerAug 21, 2021 via iPhone
18
另外说一句，如果可以选择的话，别用 react，试试 angular 。
三大 spa 框架我都用过，angular 是最完善的，全套官方功能即可满足绝大多数项目需求，不像 react 还得用一堆第三方库 |
 |
linkopeneyesAug 21, 2021
19
@Rocketer angular 一个 service 配合 rxjs 就能解决实在是舒服
|
 |
SHFAug 21, 2021
20
你需要把状态和组件解耦，抽象到一个 model 里，现实情况中有很多逻辑和数据和组件是正交的，多个组件会用多个属性
可以试试我写的这个: react-object-model - 面向对象的 React 状态管理库 1. 轻量，基于 useState (返回的 setState 具有引用稳定性，可区分组件，调用时能够触发渲染) 和 useEffect (组件卸载时清理订阅关系) 2. API 简洁、符合直觉，const { name, age } = user.use(['name', 'age']) 即可在 React 组件中完成对 user 模型中 name, age 属性的订阅； user.set({ name: 'Tom' }) 即可更新 user 模型的 name 属性并触发组件渲染 3. 根据每个组件订阅的模型属性做 diff，与上次相比改变后才更新组件状态，避免不必要的渲染 https://github.com/ShenHongFei/react-object-model |
 |
cylqdAug 22, 2021
21
我用 urlparams 传递参数
|
 |
connectionAug 22, 2021
22
UI 状态组件内部内聚消化
业务状态 抽成业务模型 props 给组件消费。 |
 |
myCupOfTeaAug 23, 2021
23
状态提升,然后把逻辑封装成 hook
|
 |
CamDOct 11, 2021 via iPhone
24
用了 mobx 后越来越抗拒 redux，建议楼主也来尝试一下
|
 |
charlie21Feb 24, 2022
25
有时候感觉 react 作为一个仅仅视图层 当然有理由让人去搭配不同的 “搭配”
但能够有这么多种方式实现一个结果，是很令人意外的，这意味着 react app 和 react app 没什么相似之处 |
|
charlie21Feb 25, 2022
26
之前不同的人用不同的框架，代码结构千差万别 v2ex.com/t/294276?p=1#r_3395030
|
 |
aec4dNov 3, 2022
27
jotai + mitt
值使用 jotai 跨组件 事件使用 mitt 跨组件 方便代码组织 |
Select Language