当前位置:   article > 正文

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

taro.request 封装
  1. import Taro from "@tarojs/taro";
  2. // import QS from 'qs'
  3. import qs from "qs";
  4. import { useUserStore } from "../store";
  5. import { log } from "console";
  6. let needLoadingRequestCount = 0;
  7. // loading配置,请求次数统计
  8. function startLoading() {
  9. Taro.showLoading({ title: "加载中", mask: true });
  10. }
  11. function endLoading() {
  12. Taro.hideLoading();
  13. } // 声明一个对象用于存储请求个数
  14. function showFullScreenLoading() {
  15. if (needLoadingRequestCount === 0) {
  16. startLoading();
  17. }
  18. needLoadingRequestCount++;
  19. }
  20. function tryHideFullScreenLoading() {
  21. if (needLoadingRequestCount <= 0) return;
  22. needLoadingRequestCount--;
  23. if (needLoadingRequestCount === 0) {
  24. endLoading();
  25. }
  26. }
  27. //loading是做了多个请求同时发起的时候防止动画叠加
  28. export default function request(url, config: any = {}, needLoading = false) {
  29. const BASE_URL = "xxxxxxxx";
  30. //默认加载都带动画设置false不加载
  31. const userStore = useUserStore();
  32. needLoading && showFullScreenLoading();
  33. return new Promise((resolve, reject) => {
  34. Taro.request({
  35. url: `${BASE_URL}${url}`,
  36. method: config.type.toUpperCase() || "GET",
  37. data: config.data || {},
  38. // data: config.paramsFormdata
  39. // ? qs.stringify(config.data)
  40. // : config.data
  41. // ? config.data
  42. // : {},
  43. header: {
  44. "Content-type": config.paramsFormdata || "application/json",
  45. "user-token": userStore.Token || "",
  46. ...config.header,
  47. },
  48. success: (result) => {
  49. const { statusCode, data } = result;
  50. console.log(result);
  51. if (statusCode === 200) {
  52. resolve(data);
  53. } else if (statusCode === 401) {
  54. Taro.removeStorageSync("TOKEN");
  55. Taro.removeStorageSync("userInfo");
  56. Taro.showToast({
  57. icon: "error",
  58. title: "登录失效",
  59. });
  60. setTimeout(() => {
  61. Taro.redirectTo({
  62. url: "/pages/index/index",
  63. });
  64. }, 1000);
  65. }
  66. },
  67. fail: (error) => {},
  68. complete: (res) => {
  69. // tryHideFullScreenLoading();
  70. },
  71. });
  72. });
  73. }

api 文件 请求文件
 

  1. import requestService from "../service/request";
  2. const Api = {
  3. H5Login: "",
  4. code: "",
  5. register: "",
  6. yzm: "",
  7. login: "",
  8. user: "",
  9. };
  10. //重构 以后的 H5-供应端获取OpenId接口
  11. export function EmitCodeByH5(data) {
  12. return requestService(Api.code, {
  13. type: "post",
  14. data,
  15. // paramsFormdata: "application/x-www-form-urlencoded",
  16. });
  17. }
  18. //重构 以后的H5-供应端 注册
  19. export function userRegister(data) {
  20. return requestService(Api.register, {
  21. type: "post",
  22. data,
  23. });
  24. }
  25. //重构 以后的H5-获取注册验证码
  26. export function getYzm(data) {
  27. return requestService(Api.yzm, {
  28. type: "post",
  29. data,
  30. });
  31. }
  32. //重构 H5的 登录接口
  33. export function Login(data) {
  34. return requestService(Api.login, {
  35. type: "post",
  36. data,
  37. });
  38. }
  39. //获取用户信息
  40. export function userInfo(data) {
  41. return requestService(Api.user, {
  42. type: "get",
  43. data,
  44. paramsFormdata: "application/x-www-form-urlencoded",
  45. });
  46. }

声明:本文内容由网友自发贡献,转载请注明出处:【wpsshop】
推荐阅读
相关标签
  

闽ICP备14008679号