vuex 使用簡介

2021-10-19 21:13:02 字數 729 閱讀 5249

import vue from "vue";

import vuex from "vuex";

vue.use(vuex);

export default new vuex.store(,

mutations:

},actions: , val)

},getters:

},modules: {} // 此處先不不用modules,另外的文章詳解

});

state:存放資料

mutations:直接對資料進行的操作

actions:提供行為,從而觸發操作(即mutations),無法直接對資料進行操作

getters:返回vuex中的資料

在main.js中:

import vue from "vue";

import router from "./router";

import store from "./store"; // 引入

vue.config.productiontip = false;

// vuex自帶了類似於vue.prototype.$store = store方式,這種方式在頁面中使用就是this.$store

// 與map的使用會有其他不同在vuex詳解的文章說明

new vue(,

computed:

更詳細的使用參見:

1 vuex簡介與安裝

1.簡介 1.1 關於vuex官網講述的更加詳細,我這邊簡要的談一下自己的理解,由於元件之間通訊比較複雜,頁面顯得比較繁瑣,所以出現了vuex狀態管理器,來集中管理元件之間共用的一些資料 2.使用場景 2.1。如果你的專案不是大型的應用專案,使用vuex也是煩瑣冗餘的,反之則建議使用 3.vuex安...

vuex使用規則

下面利用webpack搭建平台。import vue from vue import vuex from vuex import index from index.vue vue.use vuex const store new vuex.store var root document.create...

Vuex使用記錄

最近在專案上使用vuex,從陌生到熟悉,整理一下使用思路和方法,加深印象。官方文件 先明確幾個概念 1.state 資料來源 訪問 this.store.state.x2.getter vuex的計算屬性。類似於computed裡面的操作函式。如果要在多個元件使用,提取到getter中,就會十分方便...