vueX基本运用,以及作用

最新推荐文章于 2023-12-26 16:01:50 发布

熊xing

最新推荐文章于 2023-12-26 16:01:50 发布

阅读量95

点赞数

文章标签： vue.js

本文链接：https://blog.csdn.net/weixin_47239395/article/details/119668803

版权

vuex类似全局的一个store(仓库),放在里面的数据状态(state),在整个项目中,都可以获取到,跟全局对象不同的是,vuex是响应式的

当 Vue 组件从 store 中读取状态的时候，若 store 中的状态发生变化，那么相应的组件也会相应地得到高效更新。
不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation

首先在项目中新建一个文件store.js

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const state = {
    count: {}
  },
const mutations = {
   setData (state, data) {
      state.count = data
     }
  }
const action = {}
const getters = {}

export default new Vuex.Store({
   state,
   action,
   getters,
   mutations
})  

要改变store的内容: this.$store.commit('setData', this.list)
取或者监听vuex的数据: this.$store.count