How to use vuex

This article mainly introduces "how to use vuex". In daily operation, I believe many people have doubts about how to use vuex. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts about "how to use vuex". Next, please follow the editor to study!

What is Vuex?

Vuex is a centralized state management architecture designed specifically for vue.js. Status? I understand it as the part where the properties in data need to be shared with other vue components, which is called state. In a nutshell, it is the attributes that need to be shared in data.

1. In the vue component

Execute the enabledcheckbox method, with true as the parameter, to change the value in state

This.$store.dispatch ("enabledcheckbox", true)

Get the value of useredit from state

This.$store.state.useredit

2 add values to state for object pairs exported in vuex

Add mutations to change the value of state

Add actions to 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)

In main.js

Import store from'. / vuex'new Vue ({el:'# app', router, store, render:h= > h (App)}) at this point, the study of "how to use vuex" is over. I hope I can solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!