13.vuex （实现数据共享）

1.介绍
vuex 被称为一种“状态管理模式”，这个状态管理应用包含一下部分：
1.state 驱动应用的数据源（需进行共享的数据）。
2.view 以申明方式将state映射到视图上。
3.actives 响应在view上的用户输入导致的状态（数据）变化。（即用户所执行的操作）。

状态管理有5个核心，分别是state、getter、mutation、action以及module。

基于我们应用但是各种会遇到多个组件数据的共享状态，单向数据流的简洁性就会受到破坏。（data中的数据发生改变时，相应组件中所用到的相关数据也会发生相对于的改变。），如需解决此问题，可以用vuex来解决。

什么情况下我应该使用 Vuex？
Vuex 可以帮助我们管理共享状态，并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。
<u>如果您不打算开发大型单页应用，使用 Vuex 可能是繁琐冗余的。</u>确实是如此——如果您的应用够简单，您最好不要使用 Vuex。一个简单的 [store 模式]就足够您所需了。但是，如果您需要构建一个中大型单页应用，您很可能会考虑如何更好地在组件外部管理状态，Vuex 将会成为自然而然的选择。

2.安装

npm install vuex --save

在main.js(全局)当中引入vuex，并use到项目中,再创建一个store仓库。

import Vuex from 'vuex'
Vue.use(Vuex)

//创建一个store仓库
const store = new Vuex.Store({
    state:{
      count:10
    }
})

创建好之后别忘记将store注入到vue实例当中。

接下来就能直接在每个组件当用获取到你在store中添加的共享数据了。

<p>{{ this.$store.state.count }}</p>