1.在store中创建index.js,(创建的名字看个人习惯,有的人喜欢直接用modules.js,因人而异。)
作用:为了引入实例 通过modules{} 进行分包的处理。
2.store的引入
要是通过Vue-cli快速创建的话 选中了vuex的话是不需要引入的,创建的时候就已经给引入好了。
3.store文件夹下还会有User、Home、Search等等...
这些文件夹是需要看你自己项目的文件的 (名字也是随便起的,看心情. )
我的文件夹:
4.user文件夹下的内容,都是分模块管理的(这些应该是很好理解的,我写的都是vuex的名称)
5.其实最主要的还是user文件夹下的index.js文件
目的:导出所有的模块
actions.js文件:(为什么单独拿出这个文件呢?)
因为当初我因为this指向的问题报错了,所以我这里把this的指向改成了Vue,可以着重看一下。
6.获取数据
直接在create或者mounted中获取,这两个钩子都可以,也是看自己,(我用的是mounted)
附个生命周期图,可以自行参考(这个图是小编自己找的,看着容易理解。)
7.关于持久化的问题?
我这里是没有用任何的插件(我看到网上很多人都安装了插件,然后进行配置)
我是用if判断的,要是为空的话就重新赋值
if (JSON.stringify(this.$store.state.user.avatar == "[]")) {
this.$store.dispatch("user/userInfo");
}