uniapp + vue3 使用axios
uniapp自带的uni.request不太好用,也有可能是自己用axios用的太熟悉了,所以还是用axios趁手点,所以尝试在uniapp中使用axios。
·
场景
uniapp自带的uni.request不太好用,也有可能是自己用axios用的太熟悉了,所以还是用axios趁手点,所以尝试在uniapp中使用axios。
操作
因为uniapp项目没有package.json,所以先在项目根目录下执行 npm init,
执行完毕后直接 npm install axios, 这时候axios就被添加进来。
此时其实就可以直接使用了如下:
我给axios封装成了一个工具类:

import axios from 'axios'
const fetch = axios.create({
baseURL: '/api',
timeout: 30000
})
const cancelLoading = (config) => {
}
fetch.interceptors.request.use(req => {
return req
}, (error) => {
return Promise.reject(error)
})
fetch.interceptors.response.use(
config => {
try {
const code = config.data.code
// 成功处理
if (code != 0) {
return Promise.reject(config)
} else {
return config.data
}
} finally {
cancelLoading(config)
}
},
(error) => {
try {
// 失败处理
if (error?.response?.status == 401) {
}
return Promise.reject(error)
} finally {
cancelLoading(error)
}
}
)
export default fetch
之后在uniapp的.vue文件中直接使用即可:
.....
import fetch from '@/utils/fetch.js'
...
fetch.post('/xxx/xxx', this.data).then(res => {
uni.showToast({
title: `操作成功`
})
})
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐


所有评论(0)