uniapp-商城-26-vuex 使用流程
为了能在所有的页面都实现状态管理,我们按照前面讲的页面进行状态获取,然后再进行页面设置和布局,那就是重复工作,vuex 就会解决这样的问题,如同类、高度提炼的接口来帮助我们实现这些重复工作的管理。避免一直在造一样的轮子。
https://vuex.vuejs.org/zh/#%E4%BB%80%E4%B9%88%E6%98%AF%E2%80%9C%E7%8A%B6%E6%80%81%E7%AE%A1%E7%90%86%E6%A8%A1%E5%BC%8F%E2%80%9D%EF%BC%9F
上面是vuex的官网。
其实以后用vuex 比较少 但是vue2 上还是用的多,以后vue3或者4 都是用的Pinia
这样的方案到处都是。
vuex 一般项目中用的就是module 其他的模块都是很少单独使用的。
uniapp中是内置了vue下的。不需要再一次安装,只需要构建一下就好了。
vue2中如果没有安装,可以手动装,
安装 | Vuex
这里要用的有 页面动物模块状态,购物车的状态都要用到这样的状态数据。像购物车不可能需要用到购物车的数据的地方都去读取数据库,那样会很麻烦,加大数据库的访问量。而且也慢。
1、建立一个文件夹在项目中 store
2、建立一个文件 index.js 在store--->index.js
3、在index.js 导入vuex, import Vue from "vue"
具体如下:
//1、按照模块进行开发 不需要每一页面都定义 所以前面开发的shop-headebar.vue 是一个小小的demo 这里还是要用到vuex的概念
//