Vuex就是專為 Vue.js 應用程序開發的數據讀寫工具

參考官方文檔

開始 | Vuex?vuex.vuejs.org

state就是數據

mutations就是對數據的改動

commit就是調用mutations里的操作（以字符串的形式）

與vue不同它需要通過commit來觸發事件

Vue.use(Vuex)會在Vue的原型上綁定一個共用屬性，把store綁到Vue.prototype上

Vue.prototype.$store = store

從Vue組件里獲取Vuex的狀態，使用計算屬性

Vuex小結

在組件里使用它時，讀的時候分為使用對象語法還是類語法，對象語法就使用computed,

this.$store.state.count

使用類語法（JS/TS）

get

如果要寫這個API的時候使用$store配合commit

this.$store.commit('xxx',payload)//payload是一個普通值或者對象

此時無法獲取commit的返回值，如何去獲取？

this.$store.commit('setTag')

然后在

const store = new Vuex.Store({state:{count:0;tag:undefined;}, mutations:{addCount(state){state.count+=1} }

再去讀

store.state.tag

注意在安裝的時候

1、Vue.use(Vuex)

2、要把store傳進去

new Vue({store, })

在ts中使用mixins參考vue class component

Extend and Mixins | Vue Class Component?class-component.vuejs.org// mixins.js import Vue from 'vue' import Component from 'vue-class-component'// You can declare mixins as the same style as components. @Component export class Hello extends Vue {hello = 'Hello' }@Component export class World extends Vue {world = 'World' }

使用

import Component, { mixins } from 'vue-class-component' import { Hello, World } from './mixins'// Use `mixins` helper function instead of `Vue`. // `mixins` can receive any number of arguments. @Component export class HelloWorld extends mixins(Hello, World) {created () {console.log(this.hello + ' ' + this.world + '!') // -> Hello World!} }

在Labels.vue和Tags.vue里都使用過了createTag因此可以使用mixins

總結

以上是生活随笔為你收集整理的vue component created没有触发_Vue 全局数据管理-Vuex的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。