Taro 框架中 vue3 request.ts 请求封装

import Taro from "@tarojs/taro";
// import QS from 'qs'
import qs from "qs";
import { useUserStore } from "../store";
import { log } from "console";
let needLoadingRequestCount = 0;
// loading配置,请求次数统计
function startLoading() {
  Taro.showLoading({ title: "加载中", mask: true });
}
function endLoading() {
  Taro.hideLoading();
} // 声明一个对象用于存储请求个数
function showFullScreenLoading() {
  if (needLoadingRequestCount === 0) {
    startLoading();
  }
  needLoadingRequestCount++;
}
function tryHideFullScreenLoading() {
  if (needLoadingRequestCount <= 0) return;
  needLoadingRequestCount--;
  if (needLoadingRequestCount === 0) {
    endLoading();
  }
}
//loading是做了多个请求同时发起的时候防止动画叠加

export default function request(url, config: any = {}, needLoading = false) {
  
  const BASE_URL = "xxxxxxxx";
  
  //默认加载都带动画设置false不加载
  const userStore = useUserStore();
  needLoading && showFullScreenLoading();
  return new Promise((resolve, reject) => {
    Taro.request({
      url: `${BASE_URL}${url}`,
      method: config.type.toUpperCase() || "GET",
      data: config.data || {},
      // data: config.paramsFormdata
      //   ? qs.stringify(config.data)
      //   : config.data
      //   ? config.data
      //   : {},
      header: {
        "Content-type": config.paramsFormdata || "application/json",
        "user-token": userStore.Token || "",
        ...config.header,
      },

      success: (result) => {
        const { statusCode, data } = result;
        console.log(result);

        if (statusCode === 200) {
          resolve(data);
        } else if (statusCode === 401) {
          Taro.removeStorageSync("TOKEN");
          Taro.removeStorageSync("userInfo");
          Taro.showToast({
            icon: "error",
            title: "登录失效",
          });
          setTimeout(() => {
            Taro.redirectTo({
              url: "/pages/index/index",
            });
          }, 1000);
        }
      },
      fail: (error) => {},
      complete: (res) => {
        // tryHideFullScreenLoading();
      },
    });
  });
}

api 文件 请求文件
 

import requestService from "../service/request";

const Api = {
  H5Login: "",
  code: "",
  register: "",
  yzm: "",
  login: "",
  user: "",
};
//重构 以后的 H5-供应端获取OpenId接口

export function EmitCodeByH5(data) {
  return requestService(Api.code, {
    type: "post",
    data,
    // paramsFormdata: "application/x-www-form-urlencoded",
  });
}

//重构 以后的H5-供应端 注册
export function userRegister(data) {
  return requestService(Api.register, {
    type: "post",
    data,
  });
}

//重构 以后的H5-获取注册验证码
export function getYzm(data) {
  return requestService(Api.yzm, {
    type: "post",
    data,
  });
}

//重构 H5的 登录接口
export function Login(data) {
  return requestService(Api.login, {
    type: "post",
    data,
  });
}

//获取用户信息
export function userInfo(data) {
  return requestService(Api.user, {
    type: "get",
    data,
    paramsFormdata: "application/x-www-form-urlencoded",
  });
}

你可能感兴趣的:(taro,javascript,前端,vue.js)