import{_ as s,o as a,c as n,d as p}from"./app.0ed445b7.js";const i=JSON.parse('{"title":"Vuex \u72B6\u6001\u7BA1\u7406","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vuex.md","lastUpdated":1672820852000}'),l={name:"guide/vue2/vuex.md"},o=p(`

Vuex \u72B6\u6001\u7BA1\u7406

\u76EE\u5F55\u7ED3\u6784

bash

\u251C\u2500\u2500 store
\u2502   \u251C\u2500\u2500 modules
\u2502   \u2502   \u2514\u2500\u2500 app.js
\u2502   \u251C\u2500\u2500 index.js
\u2502   \u251C\u2500\u2500 getters.js

main.js \u5F15\u5165

javascript

import Vue from "vue";
import App from "./App.vue";
import store from "./store";
new Vue({
  el: "#app",
  router,
  store,
  render: (h) => h(App),
});

\u4F7F\u7528

html

<script>
  import { mapGetters } from "vuex";
  export default {
    computed: {
      ...mapGetters(["userName"]),
    },

    methods: {
      // Action \u901A\u8FC7 store.dispatch \u65B9\u6CD5\u89E6\u53D1
      doDispatch() {
        this.$store.dispatch(
          "setUserName",
          "\u771F\u4E56\uFF0C\u8D76\u7D27\u5173\u6CE8\u516C\u4F17\u53F7\uFF0C\u7EC4\u7EC7\u90FD\u5728\u7B49\u4F60~"
        );
      },
    },
  };
</script>

`,7),e=[o];function t(c,r,D,F,y,A){return a(),n("div",null,e)}const u=s(l,[["render",t]]);export{i as __pageData,u as default};

Vuex \u72B6\u6001\u7BA1\u7406 #

Vuex \u72B6\u6001\u7BA1\u7406