vuex學習 為每個需要傳遞的引數建立store

2021-10-08 04:13:17 字數 2667 閱讀 1048

之前在元件,頁面間進行引數傳遞,都是通過emit,v-on,bus.emit等,最近發現了乙個新的機制.

官網:什麼是vuex

又從vue-element-admin中學到一種使用方式,分享一下

新建專案之後,新增store資料夾,結構如上圖所示.

為需要傳遞引數的頁面建立.js檔案.

import vue from

'vue'

import vuex from

'vuex'

import getters from

'./getters'

import settings from

'./modules/settings'

import user from

'./modules/user'

import tagsview from

'./modules/tagsview'

import forms from

'./modules/forms'

import datamenu from

'./modules/datamenu'

vue.

use(vuex)

const store =

newvuex.store(,

getters})

export

default store

//getters中可以對資料進行一些處理,在不影響state的情況下返回值

const getters =

export

default getters

import vue from

'vue'

import vuex from

'vuex'

import getters from

'./getters'

vue.

use(vuex)

// const modulesfiles = require.

context

('./modules'

,true

,/\.js$/

)// it will auto require all vuex module from modules file

const modules = modulesfiles.

keys()

.reduce

((modules, modulepath)

=>,)

const store =

newvuex.store()

export

default store

//每個頁面的.js檔案可以包含三個部分:state,action和mutations

//通過state儲存狀態;mutations改變state;action觸發mutations.

const state =

}const mutations =

}const actions =

, node)

commit

('change_node'

, node)}}

export

default

//在元件中,我們約定只獲取state的值而不能直接修改它,需要通過mutations對state進行修改

//呼叫mutations

//而mutations不支援非同步修改,能看到變化,但存在潛在問題,可以通過action觸發

//因此主要考慮獲取state和呼叫action

//呼叫action

//第乙個引數是呼叫的方法名tagsview下的addview,第二個引數是傳遞給addview方法的引數

//或者

import

from

'vuex'

methods:

//獲取state

//在元件的computed中獲取,元件跟隨其變化

computed:},

//或者

import

from

'vuex'

computed:

,//也可以用如下方法,即可直接通過this.sidebar等進行呼叫

...mapstate()

,}

***在main.js中 import store from 「./store」; 並

函式引數為值傳遞 引用傳遞和指標傳遞的區別

1 值傳遞 int func int value int a 2 int b func a b 3 a 2 按值傳遞不會改變實參的值,即上例中a的值不發生變化 函式中會產生乙個臨時的區域性變數value 一般都會有返回值 2 引用傳遞 void func int value int a 2 func...

建立多個執行緒的引數傳遞問題

先看下面的程式thread1.c include include include void thread func void var int main void pthread exit null void thread func void var 編譯 gcc thread1.c pthread ...

C語言函式引數的傳遞的學習

void exchg1 int x,int y int main 輸出結果 x 6,y 4 a 4,b 6 分析 a,b的值沒有發生改變。這裡exchg1 函式有個隱含操作,int x a,y b。故在函式裡改變的是x,y的值,不改變ab。即改變了形參,沒有改變實參。void exchg2 int ...