首頁 > web前端 > js教程 > 主體

vuex 的簡單使用

亚连
發布: 2018-05-26 16:36:31
原創
1431 人瀏覽過

vuex是一個專為vue.js設計的集中式狀態管理架構。這篇文章主要介紹了vuex 的簡單使用,需要的朋友可以參考下

什麼是Vuex?

vuex是一個專為vue.js設計的集中式狀態管理架構。狀態?我把它理解為在data中的屬性需要共享給其他vue元件使用的部分,就叫做狀態。簡單的說就是data中需要共用的屬性。

1.在vue 元件中

#執行enabledcheckbox方法,true 為參數,用來改變state中的值

#
  this.$store.dispatch("enabledcheckbox",true)
登入後複製

從state取得useredit的值

this.$store.state.useredit
登入後複製

##2 在vuex中匯出的物件對新增值到state

新增mutations 來改變state的值

新增actions 來mutations

import Vue from 'vue'
import vuex from 'vuex'
Vue.use(vuex)
export default new vuex.Store({
    state: {
      useredit: false,
    },
    mutations: {
      ENABLEDCHECKBOX(state, value) {
        state.checkboxDisable = value
      },
    },
    actions: {
      enabledcheckbox({ commit }, value) {
        commit('ENABLEDCHECKBOX', value)
      },
    }
  })
  //console.log(vuex)
登入後複製

在main.js

import store from './vuex'
new Vue({
 el: '#app',
 router,
 store,
 render:h=>h(App)
})
登入後複製

上面是我整理給大家的,希望今後會對大家有幫助。

相關文章:

jQuery Ajax方式上傳檔案的方法

##利用ajax實作異步刷新請求


透過Ajax方式上傳檔案使用FormData進行Ajax請求


以上是vuex 的簡單使用的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!