uniapp，每次请求时，中断上次请求
1.封装uni.request
import {BASE_URL} from "@/config/config.js"import store from "@/store/index.js";
class RequestManager {constructor() {this.requestTasks = new Map() // 存储所有请求任务this.baseURL = BASE_URLthis.header = {'Content-Type': 'application/json','Authorization': uni.getStorageSync("AccessToken") ? 'Bearer ' + uni.getStorageSync("AccessToken") : ''}}/*** 发送请求* @param {Object} options 请求配置* @param {string} requestId 请求ID，用于标识和取消特定请求* @returns {Promise}*/request(options, requestId = 'default') {// 中断同ID的之前的请求if (this.requestTasks.has(requestId)) {this.requestTasks.get(requestId).abort()this.requestTasks.delete(requestId)}return new Promise((resolve, reject) => {const config = {url: this.baseURL + options.url,method: options.method || 'GET',data: options.data || {},header: options.header ? Object.assign({}, this.header, options.header) : options.header,success: (response) => {let res = response.dataif (res.code === 422) {store.commit('SET_USERINFO', {})store.commit('SET_ACCESSTOKEN', '')store.commit('SET_MESSAGETOTAL', 0)uni.removeStorageSync("userInfo")uni.removeStorageSync('AccessToken', '')//回到登录页uni.showToast({title: "请登录!",icon: 'none',success() {setTimeout(() => {uni.reLaunch({url: '/pages/user/index?type=login'})}, 1500)}})return false;}else if(res.code != 200){uni.showToast({title: res.msg || '',duration: 1500,icon: 'none',})}else{resolve(res)}},fail: (err) => {reject(err)},complete: () => {// this.requestTasks.delete(requestId)}}const task = uni.request(config)this.requestTasks.set(requestId, task)})}/*** 中断特定请求* @param {string} requestId 请求ID*/abort(requestId = 'default') {if (this.requestTasks.has(requestId)) {this.requestTasks.get(requestId).abort()this.requestTasks.delete(requestId)}}/*** 中断所有请求*/abortAll() {this.requestTasks.forEach(task => {task.abort()})this.requestTasks.clear()}// 快捷方法...get(url, data = {}, header = {}, requestId = 'default') {return this.request({url,method: 'GET',data,header}, requestId)}post(url, data = {}, header = {}, requestId = 'default') {return this.request({url,method: 'POST',data,header}, requestId)}
}// 创建单例
const http = new RequestManager()export default http2.封装api
goodsLess请替换成参数+自定义id，以防出现同一接口不同参数也出现中断的情况
import http from '@/request/request.js'//购物车减少商品数量
export const goodsLess = ({ goods_id, goods_sku_id }) => {return http.get(`api/user/cart/sub?goods_id=${goods_id}&goods_sku_id=${goods_sku_id}`, {}, {}, 'goodsLess')
}//购物车增加商品数量
export const goodsMore = ({ goods_id, goods_sku_id, goods_num }) => {return http.get(`api/user/cart/add?goods_id=${goods_id}&goods_sku_id=${goods_sku_id}&goods_num=${goods_num}`, {}, {}, 'goodsMore')
}
3.在页面中使用
//增加购物车数量goodsMore({ goods_id: id, goods_sku_id, goods_num: 1 }).then(res => {if(res.code == 200){item.total_num++}})