uniapp服务文件
uniapp服务文件的作用
服务文件在uniapp中通常用于封装通用的业务逻辑或接口请求，便于多页面复用。通过模块化组织代码，减少重复编写，提升可维护性。
创建服务文件的步骤
目录结构建议
在项目根目录下创建services文件夹，存放各类服务文件。例如：
/services
/userService.js // 用户相关接口
/apiService.js // 通用请求封装 基础服务文件示例
以封装HTTP请求为例（使用uni.request）：
// services/apiService.js
const baseURL = 'https://example.com/api';
export const request = (options) => {
return new Promise((resolve, reject) => {
uni.request({
url: baseURL + options.url,
method: options.method || 'GET',
data: options.data || {},
success: (res) => resolve(res.data),
fail: (err) => reject(err)
});
});
}; 调用服务文件的方法
在页面或组件中引入服务文件，调用封装的方法：
import { request } from '@/services/apiService';
// 示例：获取用户列表
const fetchUsers = async () => {
try {
const res = await request({ url: '/users', method: 'GET' });
console.log(res);
} catch (error) {
console.error('请求失败:', error);
}
}; 进阶优化建议
拦截器处理
通过全局拦截器统一处理请求和响应：
// 请求拦截
uni.addInterceptor('request', {
invoke(args) {
args.url = baseURL + args.url;
args.header = { 'Authorization': 'Bearer token' };
}
}); TypeScript支持
为服务文件添加类型定义，提升开发体验：
// services/types.ts
interface RequestOptions {
url: string;
method?: 'GET' | 'POST';
data?: Record<string, any>;
} 注意事项
- 服务文件应保持单一职责，避免过度耦合。
- 异步操作推荐使用
async/await或Promise处理。 - 生产环境中需处理敏感信息（如API密钥）的安全存储。
通过合理组织服务文件，可显著提升uniapp项目的代码复用性和可维护性。
