赞
踩
http.ts文件
import axios, { Axios, AxiosResponse, AxiosRequestConfig } from "axios"; // 处理 类型“AxiosResponse<any, any>”上不存在属性“errorinfo”。ts(2339) 关键一步。 declare module "axios" { interface AxiosResponse<T = any> {//参数与res的字段相对应 result: T; statuscode: number; reason: string } export function create(config?: AxiosRequestConfig): AxiosInstance; } // 创建axios实例 const request = axios.create({ baseURL: '',// 所有的请求地址前缀部分(没有后端请求不用写) timeout: 10000, // 请求超时时间(毫秒) withCredentials: true,// 异步请求携带cookie headers: { // 设置后端需要的传参类型 'Content-Type': 'application/json' // 'token': x-auth-token',//一开始就要token // 'X-Requested-With': 'XMLHttpRequest', }, }) // request拦截器 request.interceptors.request.use( config => { // 如果你要去localStor获取token // let token = localStorage.getItem("x-auth-token"); // if (token) { // config.headers = {"x-auth-token": token} // } return config }, error => { // 对请求错误做些什么 Promise.reject(error) } ) // response 拦截器 request.interceptors.response.use( response => { // 对响应数据做点什么 return response.data }, error => { // 对响应错误做点什么 return Promise.reject(error) } ) export default request
接口文件.ts
- import instance from "./http";
-
- export const List = (data: any) =>
- instance.post("路径", data);
vue文件中的使用
- const getdata = () => {
- state.value.metaModel.page = 1
- state.value.loading = true;
- metaModelList(state.value.metaModel).then((res) => {
- console.log(res);
- state.value.listData = res.result.result
- console.log(state.value.listData)
- });
- }
代理vue.config.js
module.exports = { outputDir: "dist", //build输出目录 assetsDir: "assets", //静态资源目录(js, css, img) lintOnSave: false, //是否开启eslint devServer: { open: true, //是否自动弹出浏览器页面 host: "localhost", port: "8080", https: false, //是否使用https协议 proxy: { "/api": { target: "", //API服务器的地址 changeOrigin: true, // 虚拟的站点需要更管origin pathRewrite: { //重写路径 "^/api": "/api", }, }, }, }, };
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。