vuex学习保留

来源:互联网 发布:js 判断上传文件类型 编辑:程序博客网 时间:2024/06/09 14:47
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);


export default new Vuex.Store({
  state:{     //state  保存所有组件都可能用到的 /兄弟组件 用到的 
      //详情信息
    show:false,
    distance:0,
    position:''
  },
  getters:{  //getters  获取状态用的 
      getShow(state){
        return state.show
      },
      getDistance(state){
        return state.distance
    },
    getPosition(state){
      return  state.position
    }
  },
  mutations:{ //mutation  用来同步操作你的state
      setShow(state,parmas){
        return state.show=parmas;
      },
      setDistance(state,params){
        return state.distance=params
    },
    //设置位置信息
    setPosition(state,params){
      return state.position=params;
    }
  },
  actions:{  //如果是异步操作你的state 必须用actions   action来操作 mutations 进而操作 state
      setShowInfo({commit},parmas){
        commit('setShow',parmas);
      },
    setDistances({commit},parmas){
        commit('setDistance',parmas);
    },
    setPositions({commit},params){
      commit('setPosition',params);
    }
  }

})

放本地也在也在里面操作

这样就可以 实现的状态的获取 /保存了

原创粉丝点击