新建 loading 分支
通过 Git 管理项目，养成良好的开发习惯，可以创建分支。最后开发完可以合并分支。
1.创建新分支并且跳转到改分支上
git checkout -b loading
2.查看分支
git branch
Loding 加载中动画
loding 是在发送网络请求等待结果的期间显示的，顾设置为全局组件
src/components/loading/loading.vue
在App.vue文件中引入该组件
1. 引入 vant 加载中组件
2. 设置判断 loading 显示变量
3. 设置拦截器
4. loading 布局设置
完整代码：
<template> <div class="loading" v-if="mainStore.isShowLoading" > <div class="loding-bg" @click="loadingClick" > <van-loading class="loading-moule" type="spinner" color="#38B0DE" size="32px" text-size="16px" vertical >加载中...</van-loading> </div> </div> </template> <script setup> import { useMainStore } from "@/stores/modules/main"; const mainStore = useMainStore() const loadingClick = () => { mainStore.isShowLoading = false } </script> <style lang="less" scoped> .loading { .loding-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.1); } .loading-moule { position: fixed; top: 50%; left: 0; width: 100%; z-index: 99; } } </style>
效果：
导航栏bug调试
bug: 地址栏输入对象的路由页面，导航栏不会触发 active 状态
Git 管理和代码托管（github）
1.添加到暂存区
git add .
2.添加到仓库
git commit -m "loading分支"
3.推送代码
git push -u origin loading
4.将本地的 loading 分支 合并到主分支上master （注意要先切换在主分支上）
git checkout mater
5.分支合并
git merge loading
6.更新远程仓库 loading 分支
git push
7.删除tabbar分支
git branch -d loading
