vue3.0 封装axios
第一步:项目下新建文件夹api和use.js用来存储调取的接口,新建文件夹utils和request.js用来封装axios第二步:request.js写入如下代码import axios from 'axios'// 创建axios实例const instance = axios.create({baseURL: 'http://192.168.2.76:8102/eduservice/ucen
·
第一步:
项目下新建文件夹api和user.js用来存储调取的接口,新建文件夹utils和request.js用来封装axios
第二步:
request.js写入如下代码
import axios from 'axios'
// 创建axios实例
const instance = axios.create({
baseURL: 'http://192.168.2.76:8102/eduservice/ucenter-member/', // api的base_url
timeout: 15000, // 请求超时时间
headers: {
'key': 'value'
}
})
// 拦截请求
instance.interceptors.request.use(config => {
// 发送请求之前做些什么
return config
}, error => {
// 请求错误做些什么
return Promise.reject(error)
})
// 拦截响应
instance.interceptors.response.use(res => {
// 对响应数据做些什么
return res
}, error => {
// 对响应错误做些什么
return Promise.reject(error)
})
export default instance
user.js写入如下代码
import request from '@/utils/request.js'
export function login (params) {
return request({
url: '/login',
method: 'post',
data: params
})
}
export function reg (params) {
return request({
url: '/reg',
method: 'post',
data: params
})
}
第三步:
以login.vue为列,将js引入页面
import {login,reg} from "@/api/user.js";
使用 loginBtn为登录按钮的点击事件
loginBtn(){
login({mobile:this.mobileVal,password:this.passwordVal}).then(result=>{
})
}
如此即可
更多推荐
已为社区贡献1条内容
所有评论(0)