feat: withRetryAsync

src/index.md

@@ -1,4 +1,3 @@
 # Todo
 
-- [ ] retryAsync
 - [ ] ~~cacheAsync~~ see [memoizee](https://github.com/medikoo/memoizee#memoizing-asynchronous-functions)

src/index.ts

@@ -2,4 +2,5 @@ export { default as debounceAsync } from './debounceAsync';
 export { default as throttleAsync } from './throttleAsync';
 export { default as concurrentAsync } from './concurrentAsync';
 export { default as cancelizeAsync } from './cancelizeAsync';
+export { default as withRetryAsync } from './withRetryAsync';
 export * from './cancelizeAsync';

src/withRetryAsync/demo.vue

@@ -0,0 +1,40 @@
+<script lang="tsx">
+import { defineComponent } from 'vue';
+import { withRetryAsync } from '..';
+
+function getApi(keywords: string) {
+  console.log('fetching', keywords);
+  return fetch(`https://httpbin.org/status/200,500,400?keywords=${keywords}`, {
+    method: 'GET',
+    mode: 'cors',
+  }).then((res) => {
+    if (res.status === 200) {
+      return {
+        data: `result for ${keywords}`,
+      };
+    } else {
+      throw new Error(res.statusText);
+    }
+  });
+}
+
+const autoRetryGetApi = withRetryAsync(getApi);
+
+export default defineComponent({
+  setup() {
+    return () => (
+      <fieldset>
+        <legend>查询场景</legend>
+        <button
+          onClick={async () => {
+            const rez = await autoRetryGetApi('abc');
+            console.log('fetched', rez);
+          }}
+        >
+          Get something same(useSamePromise)
+        </button>
+      </fieldset>
+    );
+  },
+});
+</script>

src/withRetryAsync/index.ts

@@ -0,0 +1,30 @@
+export default function withRetryAsync<T, P extends any[], R>(
+  fn: (this: T, ...p: P) => Promise<R>,
+  { maxCount = 3, retryInterval = 500 } = {},
+) {
+  return function withRetryedAsync(this: T, ...args: P): Promise<R> {
+    return new Promise((resolve, reject) => {
+      let retriedCount = 0;
+      // let timer: ReturnType<typeof setTimeout>;
+      const that = this;
+
+      execTask();
+
+      function execTask() {
+        console.log('第%d次尝试', retriedCount + 1);
+        fn.call(that, ...args)
+          .then((...r) => {
+            resolve(...r);
+          })
+          .catch((...e) => {
+            // console.log('failed');
+            if (++retriedCount >= maxCount) {
+              reject(...e);
+            } else {
+              setTimeout(execTask, retryInterval);
+            }
+          });
+      }
+    });
+  };
+}

src/withRetryAsync/readme.md

@@ -0,0 +1,35 @@
+## Intro
+
+自动重试。
+
+## Demo
+
+> demo 以网络请求为例，请打开 Devtool 查看效果
+
+<script setup>
+import Demo from './demo.vue'
+</script>
+
+<Demo />
+<details>
+  <summary>查看代码</summary>
+
+<<< src/withRetryAsync/demo.vue{13,29-34}
+
+</details>
+
+
+## Types
+
+```ts
+export default function withRetryAsync<T, P extends any[], R>(
+  fn: (this: T, ...p: P) => Promise<R>,
+  {
+    maxCount,
+    retryInterval,
+  }?: {
+    maxCount?: number | undefined;
+    retryInterval?: number | undefined;
+  },
+): (this: T, ...args: P) => Promise<R>;
+```