uniapp封装axios代码
时间: 2023-10-08 16:09:57 浏览: 60
可以使用 uni.request() 方法,它可以发起 HTTP 请求并且支持 Promise 形式的调用。需要注意的是,在发起请求时需要在 header 中设置 Content-Type 为 application/json,同时在请求体中传递参数。如果需要使用 axios,可以在 uniapp 项目中安装 axios 并使用。
相关问题
uniapp 封装 axios
uniapp封装axios是为了在开发过程中方便地发起请求并处理返回的数据。在封装中,一般会定义一个函数来发起请求,该函数可以接收请求的配置参数,并返回一个Promise对象。在函数内部,可以通过uni.request来发起请求,并利用Promise的resolve和reject来处理请求成功和失败的情况。还可以通过定义不同的请求地址来适应不同的环境,比如本地地址、测试地址和线上地址等,这样在打包发布时不需要手动修改地址。通过封装axios,可以简化请求代码,提高开发效率。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [uniapp封装axios?大可不必那么麻烦。](https://blog.csdn.net/m0_56344602/article/details/125390024)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]
uniapp封装axios
以下是uniapp封装axios的步骤:
1. 安装axios和qs
```
npm install axios qs --save
```
2. 在common文件夹下新建request.js文件,用于封装axios
```javascript
import axios from 'axios'
import qs from 'qs'
// 创建axios实例
const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API, // api的base_url
timeout: 5000 // 请求超时时间
})
// request拦截器
service.interceptors.request.use(
config => {
// 如果有token,则添加到请求头
if (localStorage.token) {
config.headers.Authorization = localStorage.token
}
// 如果请求方式为post,则将数据格式化为表单格式
if (config.method === 'post') {
config.data = qs.stringify(config.data)
}
return config
},
error => {
Promise.reject(error)
}
)
// respone拦截器
service.interceptors.response.use(
response => {
return response.data
},
error => {
return Promise.reject(error)
}
)
export default service
```
3. 在需要使用axios的地方,引入request.js文件
```javascript
import request from '@/common/request.js'
request({
url: '/login',
method: 'post',
data: {
username: 'admin',
password: '123456'
}
}).then(res => {
console.log(res)
}).catch(err => {
console.log(err)
})
```
这样就完成了uniapp封装axios的过程。通过封装可以方便地在整个项目中使用axios,并且对axios进行了一定程度的封装,可以提高代码的复用性和可维护性。