原则:

　　 中小型项目中，如果组件的公共状态不多的情况下，不建议使用vuex，反而会增加代码复杂度，想要组件通信，直接通过event bus即可，中大型项目中，多个组件公共状态较多情况下，建议使用vuex

　　vuex的具体工作流程如下:

　　 在仓库state中定义公共状态，action中发送异步请求，得到数据后调用mutation 赋值给state,组件中使用state,也可以在组件中 dispatch action和触发mutation来修改state,视图刷新

　　具体代码如下：

　　仓库代码

　　const store = new Vuex.Store({

　　state: {

　　items: [] // 定义一个公共的购物车数据

　　},

　　getters: {

　　// 可以基于已有的state 派生新的状态

　　selectedItems (state) {

　　// 过滤购物车中未选中的商品

　　return state.items.filter(item => item.selected)

　　}

　　},

　　mutations: {

　　// 定义mutation来修改state

　　INIT_ITEMS(state, items){

　　state.items = items

　　}

　　},

　　actions: {

　　// action可以发送异步请求，得到数据后commit mutation将请求结果传入

　　FETCH_ITEMS({commit}, params = {}){

　　// 调用封装好的 接口函数

　　fetchItem(params).then(res => {

　　if(res.data.code === 200) {

　　commit('INIT_ITEMS', res.data.data)

　　}

　　})

　　}

　　}

　　})

　　组件中使用 使用vuex

　　// 获取state

　　this.$store.state.items // 直接获取

　　{

　　computed: {

　　...mapState(['items']) // 助手函数获取

　　}

　　}

　　// 获取getters

　　this.$store.getters.selectedItems // 直接获取

　　{

　　computed: {

　　...mapGetters(['selectedItems']) // 助手函数获取

　　}

　　}

　　// 组件中提交action

　　this.$store.dispatch('FETCH_ITEMS', {token: 'xxx'})

　　{

　　methods: {

　　...mapActions(['FETCH_ITEMS']) // 助手函数 直接调用this.FETCH_ITEMS(params)触发

　　}

　　}

　　// 组件中也可以直接commit mutation

　　this.$store.commit('INIT_ITEMS'[,参数])

　　{

　　methods:{

　　...mapMutations(['INIT_ITEMS']) // 助手函数 直接调用this.INIT_ITEMS(参数)

　　}

　　}