{"id":188,"date":"2018-11-15T00:23:27","date_gmt":"2018-11-14T16:23:27","guid":{"rendered":"https:\/\/wp.winter-weng.cc\/work\/?p=188"},"modified":"2018-11-15T00:23:27","modified_gmt":"2018-11-14T16:23:27","slug":"vue-vuex-%e4%bd%bf%e7%94%a8","status":"publish","type":"post","link":"https:\/\/wp.winter-weng.cc\/work\/?p=188","title":{"rendered":"[Vue] Vuex \u4f7f\u7528"},"content":{"rendered":"\n<p>\u6982\u5ff5\u6027\u7684\u6771\u897f\u5148\u8df3\u904e\uff0c\u9019\u7bc7\u4e3b\u8981\u7d00\u9304\u4f7f\u7528\u5230\u7684\u8a9e\u6cd5\u3002<\/p>\n\n\n<p>Store \u57fa\u672c\u7528\u6cd5\uff1a<\/p>\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">state: {\n  \/\/ \u8cc7\u6599\n  msg: '',\n},\nmutations: {\n  \/\/ \u63a5\u6536 action\uff0c\u6539\u8b8a state\uff0c\u70ba\u540c\u6b65 function\n  setMsg (state, newValue) {\n    state.msg = newValue\n  },\n},\nactions: {\n  \/\/ \u884c\u70ba\uff0c\u53ef\u70ba\u975e\u540c\u6b65\n  changeMsg ({ commit }) {\n    setTimeout(function() {\n      \/\/ \u547c\u53eb mutation\uff0c\u4f7f\u7528 store.commit \u65b9\u6cd5\n      commit('setMsg', 'hello world');\n  }, 2000);\n}<\/pre>\n\n\n<ul class=\"wp-block-list\"><li>\u5728\u6839\u76ee\u9304\u5f15\u5165 (<code>Vue.use(Vuex)<\/code>) \u4e4b\u5f8c\uff0c\u5b50\u7d44\u4ef6\u53ef\u4ee5\u76f4\u63a5\u4f7f\u7528\u00a0<code>this.$store.state<\/code>\u53d6\u5f97 state\u3002<\/li><li>\u53ef\u4ee5\u76f4\u63a5\u5728 method \u4e2d\u9001\u51fa commit (\u5be6\u52d9\u4e0a\u4e0d\u5efa\u8b70\uff0c\u5efa\u8b70\u7d71\u4e00\u7ba1\u7406)\u3002<\/li><\/ul>\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">methods: {\n  handleChange: function() {\n    this.$store.commit('setMsg', this.aboutMsg);\n  }\n}<\/pre>\n\n\n<ul class=\"wp-block-list\"><li>\u53ef\u4ee5\u4f7f\u7528 mapActions \u4f7f\u7528 store \u4e2d\u7684 action\u3002<\/li><\/ul>\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">methods: {\n  ...mapActions([\n    'getHeadlines',\n  ])\n}\n\/\/ map \u5b8c\u53ef\u76f4\u63a5\u4f7f\u7528 this.getHeadlines()<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\u6982\u5ff5\u6027\u7684\u6771\u897f\u5148\u8df3\u904e\uff0c\u9019\u7bc7\u4e3b\u8981\u7d00\u9304\u4f7f\u7528\u5230\u7684\u8a9e\u6cd5\u3002 S&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"pgc_sgb_lightbox_settings":"","footnotes":""},"categories":[5],"tags":[27],"class_list":["post-188","post","type-post","status-publish","format-standard","hentry","category-vue","tag-vuex"],"_links":{"self":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/posts\/188","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=188"}],"version-history":[{"count":0,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/posts\/188\/revisions"}],"wp:attachment":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=188"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=188"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=188"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}