vue状态管理，vuex， Vue.observable

• 
  

• 一般来说，各个页面之间传递数据，可以用缓存，即localStorage,SessionStorage等，在cue中各个组件之间数据共享，常规用vuex，但是对于小型项目来说，就像vuex官网所说，：“如果您不打算开发大型单页应用，使用 Vuex 可能是繁琐冗余的，确实是如此——如果您的应用够简单，您最好不要使用 Vuex”，这时候，我们就可以使用vue2.6提供的新API ——————> Vue.observable手动打造一个Vuex。

1. 创建store

import?Vue?from?‘vue‘//?通过Vue.observable创建一个可响应的对象export?const?store?=?Vue.observable({
??userInfo:?{},
??roleIds:?[]
})//?定义?mutations,?修改属性export?const?mutations?=?{
??setUserInfo(userInfo)?{
????store.userInfo?=?userInfo
??},
??setRoleIds(roleIds)?{
????store.roleIds?=?roleIds
??}
}

?

1. 在组件中引用

????{{?userInfo.name?}}??import?{?store,?mutations?}?from?‘../store‘export?default?{
??computed:?{
????userInfo()?{??????return?store.userInfo
????}
??},
??created()?{
????mutations.setUserInfo({
??????name:?‘子君‘
????})
??}
}"?_ue_custom_node_="true">

?