楼主:
FrAnKw (hard to believe)
2019-09-01 19:22:08※ 引述《FrAnKw (hard to believe)》之铭言：
: 不过基本上Redux的时代已经过去了 现在我们新的案子已经完全使用hooks
: 而且管理global state的方式也找到更好的solution
: 推 errorsyntax: 推，也想了解 redux 的替代方案 09/01 13:15
很荣幸这篇文起到抛砖引玉的效果
有版友也在推文下面讨论Angular的内容 挺好的！
关于Redux替代的部分
我们公司目前是使用Apollo Client
他是一套GrpahQL的解决方案 要搭配GraphQL的后端来使用
但其实若您目前专案是使用RESTFul也不是不行使用
因为Apollo有一套package可以把Rest api转成GraphQL的
https://www.apollographql.com/docs/link/links/rest/
只是这种偏底层打地基的东西可能要在案子一开始跑时就要先订好了
或许下一个案子可以参考看看
至于实作方法
因为Apollo Client里面有cache的机制
他可以用writeData这个方法 来复写由query要进来的资料
或者使用writeQuery这个方法 来无中生有建立一个由client产生的query object
结合以上 使用情境上就可以做到
create/update 都可以共用同一组资料结构
而改动的状态 会被直接记在cache里面
https://www.apollographql.com/docs/react/advanced/caching/
只要用的GraphQL查询是一样的名字(尽量不要使用匿名查询)
那你在cache里面拿到的就会是被保存下来的state
不过要注意的地方是
Apollo Server每一个object的结构都会默认带一个基础的property叫做__typename
从后端要来的资料都会默认自动带上这个字段
要共用结构的话 在writeQuery时要把这个prop补上 不然它会报错 并且不能写入
目前我是做了一个递回的方式在资料建立时自动补
或许之后研究一下Apollo Server可以不传这个__typename的话
应该连补都不用了
我的实作方式是把useQuery这个hook做了一个包裹
包含了useQuery原先已有的东西之外
再把writeData/writeQuery上述所讲的东西 实作完后一起暴露出来
用过的同事都说好爽好棒棒
可以少写很多code
公司同事也有使用这个套件
https://github.com/apollographql/apollo-cache-persist
用来存放一些偏静态的资料
另外一些公用的组件
例如modal, breadcrumb之类的东西
我们会使用HOC 然后这些小玩意会有自己的内部状态或是使用Context
其实多去研究一下Redux的原理就可以发现
它的实作原理就是透过HOC加上context做出来的
这些共用小元件基本上方法也是类似Redux 只是他的影响范围只限于他自己本身而已
大概是这样子 欢迎提问讨论