vuex使用之 超基础小demo

119 阅读1分钟

在store文件夹的index.js写入:

import Vue from "vue";import Vuex from "vuex";Vue.use(Vuex);export default new Vuex.Store({  state: {    num:1,  },  getters:{    getnum(state){      return state.num    }  },  mutations: {    increment (state,chuan) {      state.num+=chuan    }  },  actions: {},  modules: {}});

在views文件夹里创建Home.vue,写入

<template>  <div>    <div class="box">{{num}}</div>    <button @click="active">加/button>  </div></template><script>export default {  data() {    return {};  },  computed: {    num() {      return this.$store.state.num;    }  },  methods: {    active() {      this.$store.commit("increment", 10);    }  }};</script>