Vuex官方的vuex不推荐在小型应用当中应用,当你的状态比较多但没有特别多的时候,也是需要一个类似的管理机制的,简单管理机制。
//外部一个jsexport const store = { name: 'Kunquer'}export const mutations = { setName (name) { store.name = name }}
这样一个就是简单的store,但是它不能做到响应式的处理。vue2.6发布的一个新的api,可以说是个精简版的vuex,Vue.observable, 在vue3中它变成了reactvie,返回一个响应式的对象,在vue3中返回的是一个响应式代理。所以
export const store = reactive({ name: 'Kunquer'})//导入export default { name: 'Home', computed: { name() { return store.name }, methods: { set() { mutations.setName(....) }},
页面里触发set会实现响应式更新,即使切换路由组件状态依旧可以保持。
往期回顾:
扩展的上传与更新|给你代码
随机密码生成器|给你代码
你是否像我一样排斥Composer?|给你代码