Vue.js 为什么要使用Vuex？
示例
当构建大型应用程序（例如通常由许多可重用组件组成的单页应用程序(SPA)）时，它们很快就会变得难以构建和维护。这些组件之间的数据和状态共享也会迅速中断，并且变得难以调试和维护。
通过使用集中式应用程序数据存储，可以在一个地方表示整个应用程序状态，从而使应用程序更有组织性。通过使用单向数据流，变异以及通过对组件数据进行作用域限定范围，仅访问所需的数据，就可以更轻松地推断出组件角色以及它应如何影响应用程序状态。
VueJS组件是单独的实体，它们无法轻松地彼此共享数据。要在不使用vuex的情况下共享数据，我们需要对emit数据进行事件处理，然后使用对事件进行监听和捕获on。
组成部分1
this.$emit('eventWithDataObject', dataObject)组成部分2
this.$on('eventWithDataObject', function (dataObject) {
console.log(dataObject)
})安装vuex之后，我们可以轻松地从任何组件访问其数据，而无需侦听事件。
this.$store.state.myData
我们还可以使用mutators同步更改数据，使用异步操作并使用getter函数获取数据。
Getter函数可能会用作全局计算函数。我们可以从组件访问它们：
this.$store.getters.myGetter
动作是全局方法。我们可以从组件中分派它们：
this.$store.dispatch('myAction', myDataObject)变异是更改数据的唯一方法，vuex.We可以提交更改：
this.$store.commit('myMutation', myDataObject)Vuex代码看起来像这样
state: {
myData: {
key: 'val'
}
},
getters: {
myGetter: state => {
return state.myData.key.length
}
},
actions: {
myAction ({ commit }, myDataObject) {
setTimeout(() => {
commit('myMutation', myDataObject)
}, 2000)
}
},
mutations: {
myMutation (state, myDataObject) {
state.myData= myDataObject
}
}