为什么没有引入vuex,没有use他,也可以在vue实例对象里写store配置项
帮助我们减少代码量
import { mapState, mapGetters, mapMutations, mapActions } from 'vuex'
export default {
computed: {
// 可直接在实例中使用
...mapGetters(['doubleAge'])
},
methods: {
...mapMutations(['changeName', 'changeAge']),
change () {
// 可以使用this.changeName调用
this.changeName({ name: '张三丰' })
},
}
}
是的,可以在Vue实例对象里写store配置项,但这并不是推荐的做法。使用Vuex能够更好地管理应用程序的状态,并提供了一些有用的特性,如状态快照和时间旅行。如果您的应用程序比较简单,并且您不需要管理复杂的状态,那么在Vue实例对象中写store配置项可能是可行的。例如:
new Vue({
el: '#app',
data: {
count: 0
},
methods: {
increment() {
this.count++;
},
decrement() {
this.count--;
}
},
computed: {
doubleCount() {
return this.count * 2;
}
},
store: {
state: {
todos: []
},
mutations: {
addTodo(state, todo) {
state.todos.push(todo);
},
removeTodo(state, index) {
state.todos.splice(index, 1);
}
}
}
})
在上面的代码中,我们使用了Vue的实例对象,并在其中定义了一些数据、方法和计算属性。我们还定义了一个store对象,其中包含了我们的应用程序状态和一些mutations来更改状态。在这种情况下,我们没有使用Vuex,但我们仍然能够管理应用程序的状态。
然而,对于更复杂的应用程序,我们仍然建议使用Vuex来管理状态。Vuex提供了一种清晰的方式来组织和维护应用程序的状态,并可以轻松地扩展到更大的应用程序。