uniapp请求封装
时间: 2023-08-10 16:09:23 浏览: 97
uniapp 请求代码封装
Uniapp 是一个跨平台的开发框架,可以同时开发小程序、H5、App 等多个平台的应用。在 Uniapp 中,可以使用原生的 API 进行网络请求,也可以使用第三方库进行封装。
以下是一个简单的 Uniapp 网络请求封装示例:
1. 创建一个请求封装的文件,例如 `api.js`:
```javascript
// 导入需要的模块
import request from 'uni-request';
// 设置请求的基本配置
request.defaults.baseURL = 'http://api.example.com';
request.defaults.headers.common['Authorization'] = 'Bearer token';
// 封装 GET 请求方法
export function get(url, params) {
return new Promise((resolve, reject) => {
request.get(url, { params })
.then(response => {
resolve(response.data);
})
.catch(error => {
reject(error);
});
});
}
// 封装 POST 请求方法
export function post(url, data) {
return new Promise((resolve, reject) => {
request.post(url, data)
.then(response => {
resolve(response.data);
})
.catch(error => {
reject(error);
});
});
}
```
2. 在需要使用网络请求的页面中,导入 `api.js` 文件并调用相应的方法:
```javascript
import { get, post } from '@/api.js';
// 使用 GET 请求
get('/api/users', { page: 1 })
.then(data => {
console.log(data);
})
.catch(error => {
console.error(error);
});
// 使用 POST 请求
post('/api/login', { username: 'admin', password: '123456' })
.then(data => {
console.log(data);
})
.catch(error => {
console.error(error);
});
```
这样就可以在 Uniapp 中进行网络请求的封装和调用了。封装请求的好处是可以统一处理请求的配置、错误处理等,方便管理和维护。当然,具体的封装方式可以根据项目需求进行适当的调整。
阅读全文