javascript - 关于Vuex的几个疑问

Question

看了vuex的一些文档，大多数说的比较官方，说实话，看的云里雾里的。
这里向熟悉vuex的大神提几个问题，希望大神们用通俗易懂的话告诉我它的真理。

1. 什么是状态管理？

2. 经常看到vuex文件夹下的store.js、actions.js、getters.js，这几个各自的作用及关系？

function makeAction(type) {
  return ({ dispatch }, ...args) => dispatch(type, ...args);
};

action.js中这段代码的意义是什么？

请原谅我的无知，感谢大神指点

Answer 1

个人理解：

1、对于状态管理
你可以认为你定义了一个变量X，这个X最终会渲染到html的某<p>上。
现在你修改了X，你知道，浏览器知道，但是这个html不知道，这就需要一个啥玩意要监视着这个X，当X被修改的时候，察觉并去修改某<p>

2、
store.js里存的就是你的X，只有存在这里，X才会被监视。文件中包含state和mutations，一个是状态一个是修改方法；
getters.js，从这里才能获取到被监视的X；
action.js，从这里修改X，他的变动才会被监视发现。

function makeAction(type) {
  return ({ dispatch }, ...args) => dispatch(type, ...args);
};

其实就是返回了个函数而已，主要执行的就是dispatch。
比如dispatch('X','AAAA')，那么<p>那里就会变成字符串AAAA了。

流程大概就是这样：
actions.js修改→store.js发现修改→getters.js渲染

大致就是这么个意思，根据1.0自己得来的经验。

然而我觉得这么做挺恶心的，兜了一大圈没有靠谱的debug方法，性能还上不去。

Answer 2

看官方文档。另外，你不理解状态管理是什么，就说明你还不需要它

Answer 3

1，什么是状态管理。。从实际应用出发。用户是否登录、文章是否收藏、是否点赞、用户信息、网站信息、等等这些判断是整个应用层都需要的，但是vue呢又是组件化应用，组件之间通讯势必比较麻烦。所以状态管理就是把一些可能需要多组件公用的数据抽离出来，单独管理。

2，store.js保存的就是上面说的可能要公用的数据的仓库，getters.js故名思意就是获取这些数据的，actions.js就是将store.js中修改数据的方法暴漏给组件使用的。。至于为什么不让组件直接修改store.js中的数据，文档有解释，大概是为了解除耦合，并且消除一些副作用

Answer 4

1. 状态管理。

本来放到各个组件内的数据，现在都集中到一个地方，这个地方叫做store，放到store内的数据的更新和引用就是状态管理。

1. store.js内放置我刚刚提到的store代码，类似的actions.js放置更新数据的代码、getters.js放置获取数据的代码。

猜你还是不容易懂。不如看这个，有可以运行的代码案例：

https://segmentfault.com/a/11...