请问使用 Vuex 的好处究竟在哪里?

2020-05-14 15:53:00 +08:00
 chenluo0429
集中管理,状态可预测这些使用全局对象一样可以做到。那么对比全局对象 Vuex 的收益究竟在哪里呢?
4944 次点击
所在节点    Vue.js
17 条回复
drydiy
2020-05-14 16:22:04 +08:00
社区维护,大家都是用的同一套方案。新人进来就会用。
你使用全局对象做的比 vuex 优秀的话可以自己做,团队没能力维护的话不如 vuex 来的方便。
nianyu
2020-05-14 16:25:25 +08:00
我一直把它理解成全局对象用
murmur
2020-05-14 16:27:28 +08:00
vuex 可以绑定模板,全局变量不能,得自己 watch
guolaopi
2020-05-14 17:26:49 +08:00
@murmur #3
+1

其实本质上就是当“全局变量”用的,只不过优化了一些流程(如改变数据和获取数据)。

vuex 的 actions 是异步的且会按顺序执行,
从 action => mutation => getters 这一个流程保证在同时修改一个数据时,数据几乎不会被污染(没具体测试过)。

另外可以通过 computed 来实现模板中的双向绑定,全局变量不可以,要使用 watch 方式
( watch 我记得性能好像差一点?也可能我记错了?望有大佬解答关于 watch 和 computed 性能差异


(其实应该也可以自己实现一套机制,来解决多次不同时修改一个全局变量的值后结果是期望值,
且实现一套机制挂载到根示例下使其也可以通过 computed 来双向绑定,但是实现这么多的话不等于自己做一套 vuex 吗)
rabbbit
2020-05-14 17:35:48 +08:00
就是把全局对象(state)和修改全局对象的代码(mutation action)集中在一起,便于管理 /调试.
vuex 禁止直接修改 state, 多人合作的时候,如果谁都能改全局对象的话,就很难调试了.
修改全局对象时候, 还能用 vue devtools 跟踪流程,便于调试.
rabbbit
2020-05-14 17:41:46 +08:00
不过,因为不建议在 action 里修改 state, 所以很容易写出这种代码...

mutations: {
setName(state, name) {
state.name = name;
},
},
actions: {
setName({ commit }, name) {
commit('setName', name);
},
},
zhuweiyou
2020-05-14 18:00:55 +08:00
全局变量没问题,但是它不会 “响应”,就是 “数据发生改变,视图不会自动刷新”

你要自己写 “watch” 的逻辑
namelosw
2020-05-14 18:13:41 +08:00
> 全局对象一样可以做到

我觉得你就是想一想,根本没仔细试过是不是可行。
JayLin1011
2020-05-14 19:55:52 +08:00
Vuex 屬於 Vue 生態全家桶的一部分,有很棒的功能和使用場景,但是不是必須的,你不用也可以,因為「 Flux 架构就像眼镜:您自会知道什么时候需要它。」。
phpcxy
2020-05-15 09:11:59 +08:00
@rabbbit #6 如果在 vue 里面修改 state,可以使用 store.commit()吧
Doracis
2020-05-15 09:24:41 +08:00
团队项目看 vuex 就很省心,比如权限或者登录状态,即使刚进项目,也可以直接拿来用,节省时间,不用重新读一遍代码
ccyu220
2020-05-15 09:39:39 +08:00
个人理解是,可安全异步操作的全局对象。
SilentDepth
2020-05-15 14:21:26 +08:00
Vuex 是一个「解决方案」,或者「业务模型」。如果你就那么一两个全局状态,引用也不多,用谁都差不多。但等你状态再多一点,衍生逻辑也多一点,即使你不用 Vuex 也会不由自主地搞一个类似的「全局状态管理器」。Vuex 就是给你省了自己造轮子的工夫。
faceRollingKB
2020-05-23 20:02:18 +08:00
全局变量+跟 vue 状态系统对接
缺点:state 、getters 、mutation 其实是一个 property 的 value 、get 、set 定义,vuex 把这几个属性描述分开了,写起来很麻烦,另外在架构设计过程中跟全局变量有着一样的问题,就是无法适应多变的组件、状态关系,例如部分组件需要用到部分公共状态,实现起来就很麻烦,要自己控制状态的生命周期、命名空间
jabala
2020-06-03 23:07:36 +08:00
vuex 跟把全局数据挂到根组建,然后用$parent 有什么区别
96412hj
2020-07-02 10:08:41 +08:00
我一般在 vuex 中处理异步的数据,比如 ajax,utils 文件夹 format 数据,.vue 文件调用,使用 vuex 中的 module,确实挺香的,我自己觉得代码梳理起来很方便
wisetc
2021-10-26 00:10:05 +08:00
存储全站数据。缓存。reactive. accessible method. modules. pure.

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

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

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

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

© 2021 V2EX