医院挂号系统日志

搭建router

import { createRouter, createWebHistory } from "vue-router";

/* 配置路由 */
const route = createRouter({
    // 路由模式，
    history: createWebHistory(),
    // 管理路由，路由懒加载
    routes: [
        {
            path: '/',
            redirect: '/home'
        },
        {
            path: '/home',
            component: () => import('@/pages/home/index.vue')
        }
    ],
    // 滚动行为：控制滚动条的位置(在支持 history.pushState 的浏览器中可用)
    scrollBehavior() {
        return {
            top: 0,
            left: 0
        }
    }
})
export default route

element-plus

按需引入

国际化

自定义插件，减少main.js代码过于多而冗余

Axios

为什么要对axios进行二次封装

1. 利用axios的请求和响应拦截功能
2. 请求拦截器，一i版可以在请求头钟携带公共的参数token
3. 响应拦截器，可以简画服务器返回的数据，处理http网络错误

为什么要创建多个实例？

1. 再导入axios这个库的时候，直接调用axios这个方法默认调用的是axios给你返回来的实例，如果直接用他，那么整个项目只能请求一台服务器的地址，而且修改baseurl等其实比较麻烦
2. 而自己封装一个baseurl可以创建多个实例，每个实例可以请求不同的服务器，而且修改起来比较简单

请求和响应拦截器

1. 不用原生ajax一部分原因在于它需要我们自己封装拦截器，比较麻烦，我也不会，所以axios
2. axios.interceptors.request.use(请求成功回调拦截 (config) => {修改配置，携带token return config}，请求失败回调拦截(err) => {})
3. axios.interceptors.response.use(响应成功回调拦截（res）=> {return res.data}，响应失败回调拦截(err) => {return err})

设置了get请求参数映射

pinia

数据持久化

跨域问题

Bug

v-if

不能在元素下的value，即不能.来进行判断