Vuex的簡單使用

一丶個人理解:vuex相對於來說是乙個儲存空間，也就是說它相當於乙個大倉庫，裡面放的是我們的資料.

二丶我覺得有乙個地方用vuex就非常的適合，就是在我們進行元件傳值的時候，比如說父子傳值，單個的父子傳值用乙個props來接受很簡單,但是你要是給你子的兒子（父親的孫子），以此類推傳值的時候，我們總不能一直用props去乙個乙個接收吧，這時候就可以用到vuex來傳遞我們需要的資料了，下面是做了乙個簡單的加減的操作，不多說了，直接上**.

<

template
>
<
div 
class
="home"
>
} 
<
button 
@click
="add(1)"
>+
button
>
<
button 
@click
="jian"
>-
button
>
div>
template
>
<
script
>
//引入輔助函式
import from 
"vuex
"export 
default
},computed:
...mapstate()
},methods:
}script
>

三丶在vue的專案中有乙個store的資料夾，開啟它，找到index.js檔案,下面是**.

1

import vue from 'vue'
2import vuex from 'vuex'34
vue.use(vuex)56
export default new vuex.store(,
10mutations: ,
15jian(state)
1621}22
},23
actions: ,
27jian(context)
30},
31modules: 
33})
34 //總結 actions用來操作mutations 然後再通過mutations來操作state

注：  **1中}     這個是直接就可以再頁面中獲取到我們儲存在store裡面的index.js裡面的count資料;一般不常用這個方法.

vuex的簡單使用

使用了 vue lic腳手架 我不說得很理論，我就說得很通俗 在store檔案下面寫成 index.js是載入全部 下面是 modules檔案下的wallet.js export default getters mutations actions src 這是index.js import vue ...

vuex 簡單的使用

首先是專案目錄結構 我的vuex的目錄是這樣的，簡單說一下每個js檔案的作用吧 首先是 index.js 檔案 這個檔案主要配置 vuex 的入口及檔案的配置 import vue from vue import vuex from vuex vue.use vuex import state fr...

vuex的簡單使用

專案結構 一 建立store 建立分割成模組 module 的state 專案 中建立store資料夾，同時建立index.js，在modules中定義userinfo這個state index.js import vue from vue import vuex from vuex vue.use...