I used to do AngularJS
and now I wanna try to work with Vue.js
.
But I have a simple question: what is the best way to use and access states? I saw so many solutions on Google but I can’t find which one is the best for a beginner.
I used to use states like this :
$state.go('homework', { homework: homework.homework});
Can you give me an exemple of this code in Vue? Basically, go to homework and give him an homework.
Advertisement
Answer
In Vue.js
it works with Vuex
, the management library. You can find a documentation for state management in Vue.js
here or and for Vuex
here.
Example from the documentation for Vuex
:
const store = new Vuex.Store({ state: { count: 0 }, mutations: { increment (state) { state.count++ } } })
Use your Vuex
store in your app:
new Vue({ el: '#app', store })
Access your state in a component:
this.$store.state.count
Change the state according to the example (state.count++)
:
this.$store.commit('increment')
Edit:
To complete the answer with a example for your question. Declare
const store = new Vuex.Store({ state: { homework: "Example" }, mutations: { setNewHomework (state, newHomework) { state.homework = newHomework } } })
Set a new state for homework
:
this.$store.commit('setNewHomework', 'New Homework')