什么是vuex?，vuex在vue中怎么使用?

什么是vuex?

是一个专为 Vue.js 应用程序开发的状态管理模式， 采用集中式存储 管理应用的所有组件的状态

vuex在vue中的使用?

1.想要在vue中使用vuex首先需要在项目中安装和配置vuex npm install vuex

2.要在新建的stort/index.js中引入 import Vuex from 'vuex'

3.在stort/index.js中的配置

import Vuex from 'vuex'
 
Vue.use(Vuex)
 
export default new Vuex.Store({
  //数据，相当于data
  state: {
    name:"张三"，
    age:"18"
  },
  getters: {
    
  },
  //里面定义方法，操作state方发
  mutations: {
    
  },
  // 操作异步操作mutation
  actions: {
    
  },
  modules: {
    
  },
})

4.在组件中使用vuex中定义的数据

<div>{{name}}--{{age}}</div>

import { mapState} from "vuex";
 computed: {
    ...mapState({
      name: state => state.name,
      age: state => state.age
    })
  },

5在组件中改变vuex中定义的数据

  import { mapMutations, mapActions} from "vuex";
  
  //index.js
  
  state: {
    name:"张三"，
    age:"18"
  },
  //里面定义方法，操作state方发
  mutations: {
    addFruits(state, value) {
      state.name=value
    }
  },
  // 操作异步操作mutation
  actions: {
    addFruitsaction({ commit }, value) {
        commit("addFruits", value)
    },
  },
 
  //view.vue
  
   methods: {
    ...mapMutations(["addFruits"]),
    ...mapActions(["addFruitsaction"]),
    
    btn1(){
       this.addFruits("李四")
    }
    
    btn2(){
       this.addFruitsaction("李四")
    }
  }