美文网首页
vuex开始

vuex开始

作者: 小冕 | 来源:发表于2017-12-06 09:35 被阅读0次

    每个Vuex应用的核心就是store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的状态(state)。
    Vuex和单纯的全局对象有以下两点不同:
    1.Vuex的状态存储是响应式的。当Vue组件从store中读取状态的时候,若store中的状态发生变化,那么相应的组件也会相应地得到高效更新。
    2.你不能直接改变store中的状态。改变store中的状态的唯一途径就是显式地提交(commit)mutation。
    简单创建使用示例

    //如果在模块化构建系统中,要确保在开头调用Vue.use(Vuex)
    const store= new Vuex.Store({
    state:{
    count:0
    },
    mutations:{
    addcount(state){
    state.count++
    }
    }
    })
    

    通过store.state来获取状态对象,以及通过store.commit方法触发状态变更:

    store.commit('addcount')
    console.log(store.state.count) //1
    

    强调,通过提交mutation的方式,而非直接改变store.state.count,是因为想更明确地追踪到状态的变化。
    由于store中的状态是响应式的,在组件中调用store中的状态简单到仅需要在计算属性中返回即可。触发变化也仅仅是在组件的methods中提交mutation。
    本文来源vuex官网

    相关文章

      网友评论

          本文标题:vuex开始

          本文链接:https://www.haomeiwen.com/subject/pgfkixtx.html