vuex

1、安装 npm install vuex-save
2、store.js中

 1 import Vue from 'vue'
 2 import Vuex from 'vuex'
 3 
 4 Vue.use(Vuex)
 5 
 6 export const store = new Vuex.Store({
 7     state:{//存放数据
 8         products:{}
 9     },
10     getters:{//对存放在state中的数据进行状态处理再输出
11         getters方法:(state)=>{}
12     },
13     mutations:{
14         mutations方法:(state)=>{},
15         mutations中要请求分发的方法名:(state,payload)=>{
16         
17         }
18     },
19     actions:{//
20         actions方法:(context,payload){
21         context.commit('mutations中要请求分发的方法名',payload)
22         }
23     }
24 })

3、在main.js中

1 import {store} from './store/store'
2 new Vue({
3     store :store
4 })

4、在组件拿存放在vuex中的值

 1 export defalut{
 2     computed:{
 3         products(){
 4             return this.$store.state.products
 5         },
 6         getters方法(){//此处命名与下方命名不必一致,此处命名左右在当前组件的template中
 7             return this.$store.getters.getters方法
 8         }
 9     },
10     medhods:{
11         触发mutation的方法(){
12             this.$store.commit('mutations方法')
13             
14         }
15         触发acions的方法(amount){
16         this.$store.dispatch('actions方法',amount)
17         }
18     
19     }
20 }

 

posted @ 2018-10-10 15:48  陈南北  阅读(114)  评论(0编辑  收藏  举报