码迷,mamicode.com
首页 > 其他好文 > 详细

vuex的使用

时间:2018-06-13 23:28:09      阅读:212      评论:0      收藏:0      [点我收藏+]

标签:class   --   请求   out   comm   new   time   turn   axios   

import Vue from vue
import Vuex from vuex
import axios from axios

Vue.use(Vuex);

const state = {
    count:10 //用来定义数据存数据    此处的数据可以在actions里面去接收一下
}
const mutations = { //处理数据动作 默认接收一个state 主要处理数据的变化  处理actions的数据
    go(state){
        state.count++
    },
    ww(state){
        state.count--
    },
    xx(state){
        state.count++
    },
    cc(state){
        state.count--
    }
}
const getters = {    //在前端组件里只能在computed里接收数据
    count(state){
        return state.b  
    },
    getOdd(state){
        return state.count%2===0?偶数:奇数
    }
}
const actions = { //提交数据动作   接收methods里的方法
go: ({commit}) => { console.log(commit) commit(go); }, ww({commit}){ commit(ww); }, xx({commit,state}){ if(commit.count%2===0){ commit(xx) } }, cc({commit}){ //这里异步可以实现ajax请求 new Promise((resolve)=>{ setTimeout(function(){ commit(cc) },1000); }) } } export default new Vuex.Store({ actions, mutations, getters, state })

 

vuex的使用

标签:class   --   请求   out   comm   new   time   turn   axios   

原文地址:https://www.cnblogs.com/l8l8/p/9180446.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!