前端pinia状态管理

1.创建vue项目  在cmd 执行命令   npm init vue@latest     输入项目名字后回车  全部选择No创建一个空项目

2.可以查看pinpa官网教程导入pinpa到项目

3.pinpa 入门

   3.1：安装依赖  npm install pinpa 

   3.2：可以自行创建js文件  导入  pinpa     并将方法抛出 如图

   3.3：操作完上一步就可以在组件中导入该js方法  访问pinia对象的数据以及方法了

3.4：pinia中的getter 关键字是 computed 注意别用{}  返回的getter是值

3.5： 定义异步 action  这个和组合式api是一样的 定义数据 获取数据

 ：注意  在引用的时候遍历 list 就可以 不遍历list.value  不然加载不出来数据 不知道为啥

3.6: storeToRefs  解决 直接解构赋值响应式数据丢失的问题 即：const {a,b} =  store  这样会丢失数据   const {a,b} = storeToRefs  (store  ) 这样可以解决

2.小兔鲜项目起步

1.npm install vue@latest   选择  router  pinpa  Eslink 创建项目  创建完成后执行 npm i 下载依赖

2.创建必要文件结构 新增文件夹  api api接口文件夹     composables组合函数文件夹

 directives  全局指令文件夹    styles 全局 样式文件     utils 工具类

3.执行 git init  初始化项目    git add . 首次文件到git管理   git commit -m "提交的备注"  提交代码到git 

4.提交代码代远程仓库  git pull -f origin master 强制拉取   git push -f origin master 强制提交 慎重用 会把远程仓库更新到和本地仓库一样