vue3+antd开发第三天

导读:第一个接口访问时 导入axios 以及如何配置axios 在使用axios 的时候用改用什么样的格式,前端如何配置能够避免CORS同源策略问题:

1. 在cmd 中 ctrl + c 停止项目,

2. npm install axios -D 下载 axios

3. 在main.js中挂载 axios

import { createApp } from 'vue'
import { createPinia } from 'pinia'

import App from './App.vue'
import router from './router'
import Antd from 'ant-design-vue';
import * as echarts from 'echarts'
// global import moment
import axios from 'axios'   //导入axios
import dayjs from 'dayjs';

import './assets/main.css'
import 'ant-design-vue/dist/antd.css';

const app = createApp(App)


app.config.globalProperties.$echarts = echarts
app.config.globalProperties.$axios = axios   //app 挂载  aixos
app.config.globalProperties.$dayjs = dayjs


app.use(createPinia())
app.use(router)
app.use(Antd)

app.mount('#app')

4. 修改url匹配方式为hash路由

const router = createRouter({
  history: createWebHashHistory(import.meta.env.BASE_URL), 
  routes: [               //解决误把router path 
    {                    //当成后端接口访问
      path: '/login',    //结果浏览器没有接收到后端返回值导致404
      name: 'Login',
      component: Login
    },

用来解决这个问题