Vue Vuex学习（1）

Vuex是什么？

Vuex是一个专为Vue.js应用程序开发的状态管理模式。采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

安装Vuex

注意这里需要安装的是3.0版本，4.0版本是最新的匹配的是vue3而不是vue2

npm install vuex --save

并在main.js文件中引入，显式地通过Vue.use（）来安装Vuex

开始

stroe（仓库）：创建需要提供一个初始state对象和mutation

在src目录下新建文件夹vuex-》文件 store.js文件，并在main.js文件中引入使用类似于router

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

Vue.use(Vuex)

const store = new Vuex.Store({
  state:{
    count: 0,
  },
  mutations: {
    increment(state){
      state.count++
    }
  }
});
export default store

使用this.$store.state.对象名来获取状态对象，通过this.$store.commit()方法来触发状态变更

例，在view1中对store中的count进行更新

<template>
  <div class="content">
    <div>展示state中的count的值： {
   { $store.state.count }}</div>
    <el-button @click="stateCountIncrement">store.count++</el-button>
  </div>
</template>
export default {
methods: {
    stateCountIncrement() {