今回はvuexを使用する際の注意事項についての分析をお届けします。以下は実際のケースです。
Vuexとは何ですか?
vuex は、vue.js 用に特別に設計された集中状態管理アーキテクチャです。州？私はこれを、他の Vue コンポーネントと共有する必要があるデータ内の プロパティ の一部 (状態と呼ばれる) として理解しています。簡単に言えば、データ内で共有する必要があるのは属性です。
1. vueコンポーネントで
のenabledcheckboxメソッドを実行します。 trueは状態の値を変更するために使用されるパラメータです
this.$store.dispatch("enabledcheckbox",true)状態からusereditの値を取得します
this.$store.state.useredit
2 オブジェクトをエクスポートしますvuex で state に値を追加します
state の値を変更するミューテーションを追加します
main.js のミューテーションにactionを追加します
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)in main.js
import store from './vuex'
new Vue({
el: '#app',
router,
store,
render:h=>h(App)
})まとめ
私はあなたを信じていますこの事例を読みました この方法をマスターしたら、よりエキサイティングなコンテンツについては、php 中国語 Web サイトの他の関連記事に注目してください。
推奨読書:
Vue は動的更新 Echarts コンポーネントを実装します
ブートストラップで selectpicker を使用してドロップダウン ボックスを実装します
以上がvuex の使用手順の分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
