nuiapp封装接口-兔兔

在 Uniapp 中封装 API 请求，可以按照以下步骤进行：

1. 创建 API 服务模块

首先，创建一个新的 JavaScript 文件，例如 api.js，来集中处理所有的 API 请求。

// api.js

const BASE_URL = 'https://your-api-base-url.com'; // 替换为你的 API 基础 URL

// 封装请求函数
const request = (url, method = 'GET', data = {}, headers = {}) => {
  return new Promise((resolve, reject) => {
    uni.request({
      url: `${BASE_URL}${url}`,
      method: method,
      data: data,
      header: {
        'Content-Type': 'application/json',
        ...headers,
      },
      success: (res) => {
        if (res.statusCode >= 200 && res.statusCode < 300) {
          resolve(res.data);
        } else {
          reject(res);
        }
      },
      fail: (error) => {
        reject(error);
      }
    });
  });
};

// 封装具体的 API 请求
export const getUser = (userId) => {
  return request(`/user/${userId}`, 'GET');
};

export const createUser = (userData) => {
  return request('/user', 'POST', userData);
};

// 可以继续添加其他 API 请求

2. 使用 API 服务模块

在你的页面或组件中，导入并使用你封装好的 API 服务模块：

// 在你的页面或组件中
import { getUser, createUser } from '@/path/to/api.js'; // 替换为实际路径

export default {
  data() {
    return {
      user: null,
      error: null,
    };
  },
  methods: {
    async fetchUser(userId) {
      try {
        const response = await getUser(userId);
        this.user = response;
      } catch (error) {
        this.error = error;
        console.error('获取用户信息失败:', error);
      }
    },
    async addUser(userData) {
      try {
        const response = await createUser(userData);
        console.log('用户创建成功:', response);
      } catch (error) {
        console.error('创建用户失败:', error);
      }
    },
  },
};

总结

• 创建请求函数：封装 API 请求的基本逻辑。
• 封装具体 API：根据实际需要定义不同的 API 请求方法。
• 使用 API 模块：在页面或组件中调用封装好的 API 方法，处理数据和错误。

这样做可以让 API 请求逻辑集中管理，方便维护和使用。