1. 程式人生 > >Vuex的使用(購物車案例)

Vuex的使用(購物車案例)

  ##Vuex是什麼?

  Vuex官網的定義,Vuex 是一個專為 Vue.js 應用程式開發的狀態管理模式。它採用集中式儲存管理應用的所有元件的狀態,並以相應的規則保證狀態以一種可預測的方式  生變化。Vuex 也整合到 Vue 的官方除錯工具 devtools extension,提供了諸如零配置的 time-travel 除錯、狀態快照匯入匯出等高階除錯功能。

  我的理解,當一個專案中,有一個狀態,整個專案都有可能去讀寫,就可以使用vuex來管理。或者元件需要去修改一個不在該元件內部的狀態時就需要使用vuex。

  ##案例

  現在以一個購物車為例,學習一下vuex的使用方法。

  一、建立一個vue專案

    yarn global add @vue/cli(安裝vue-cli,我使用的是yarn進行安裝,你可以使用別的安裝,可以查閱vuejs的官網,也可以百度vuecli安裝教程,有很多)

    vue creat vuex-cart (建立專案)

  二、該案例程式碼已上傳至github,如需使用請clone

    建立一個資料夾,開啟命令提示符,輸入git init回車

    然後git clone [email protected]:David-langqing/vuex-cart.git

    克隆程式碼。(本人github:https://github.com/David-langqing)

    完