iota-fetch 0.0.1

package/src/axios/fetch.js

@@ -0,0 +1,22 @@
+import fetchData from "./fetchFun";
+import createInstance from "./instance";
+
+const createFetch = ({ requestConfig, loading }) => {
+  let instance = createInstance({ requestConfig });
+
+  if (!requestConfig) throw "需要 requestConfig";
+
+  //将封装的数据分发下来
+  const fetch = ["get", "post", "delete", "put", "patch"].reduce((pre, cur) => {
+    return {
+      ...pre,
+      [cur](url, data, config) {
+        return fetchData(instance, { method: cur, url, data, config }, loading); // 请求方式
+      },
+    };
+  }, {});
+
+  return { fetch, instance };
+};
+
+export default createFetch;

package/src/axios/fetchFun.js

@@ -0,0 +1,40 @@
+import requestQueue from "./resQueue";
+
+const { createMapKey, queue } = requestQueue;
+
+const fetchData = (instance, { url, method, data, config }, loading) => {
+  const controller = new AbortController();
+  let httpOpts = {
+    url,
+    method,
+    ...config,
+    signal: controller.signal,
+  };
+
+  // 注册 请求队列
+  let key = createMapKey(method, url, data);
+  queue.set(key, controller);
+
+  if (["get", "delete"].includes(method)) {
+    httpOpts = { ...httpOpts, params: data };
+  }
+
+  if (["patch", "put", "post"].includes(method)) {
+    httpOpts = { ...httpOpts, data };
+  }
+
+  return new Promise((resolve, rejects) => {
+    config?.loading && loading?.show();
+    instance(httpOpts)
+      .then((res) => resolve(res.data))
+      .catch((err) => rejects(err))
+      .finally(() => {
+        // 每次请求完要对Resqueue 删除
+        queue.has(key) && queue.delete(key);
+        // 如果有load show 需要关闭
+        config?.loading && loading?.hide();
+      });
+  });
+};
+
+export default fetchData;

package/src/axios/instance.js

@@ -0,0 +1,8 @@
+import axios from "axios";
+
+const createInstance = ({ requestConfig }) => {
+  const instance = axios.create({ ...requestConfig });
+  return instance;
+};
+
+export default createInstance;

package/src/axios/resQueue.js

@@ -0,0 +1,39 @@
+class RequestQueue {
+  queue = new Map();
+
+  constructor() {
+    if (RequestQueue.instance) {
+      return RequestQueue.instance;
+    }
+
+    RequestQueue.instance = this;
+  }
+
+  // 获取queque
+  getQueue() {
+    return this.queue;
+  }
+
+  // 生成队列的key
+  createMapKey(method, path, data) {
+    let params = data ? `-${JSON.stringify(data)}` : "";
+    return `${method}-${path}` + params;
+  }
+
+  // 中断key
+  abortive(key) {
+    const controller = this.queue.get(key);
+    controller?.abort();
+    this.queue.delete(key); // 中断后移除该key
+  }
+
+  // 中断所有请求
+  removeResAll() {
+    this.queue.forEach((controller) => controller.abort());
+    this.queue.clear(); // 清除队列
+  }
+}
+
+let requestQueue = new RequestQueue();
+
+export default requestQueue;

package/src/main.js

@@ -0,0 +1,5 @@
+import createFetch from "./axios/fetch";
+import requestQueue from "./axios/resQueue";
+
+export { requestQueue };
+export default createFetch;