vue-asyncx 1.5.0 → 1.5.2

package/README.md

@@ -1,40 +1,64 @@
 ## 特性
 
-- 异步函数样板代码减少50%
-- 异步函数相关的函数、变量命名风格统一
-- 异步函数调用有序
-- 良好的 ts 提示支持
-- 单元测试覆盖率 100% 
+- 效率+：异步相关样板代码减少50%
+- 效率+：自动处理异步操作的乱序响应
+- 可读+：异步操作命名指向明确、风格统一
+- 可读+：易于写出符合“干净架构”理念的函数
+- 质量+：全 TS 支持 + 100% 单元测试
 
-## 开始
-
-### 安装
+## 安装
 
 ```console
 pnpm i vue-asyncx
 ```
 
-### 使用
+## 使用
+
+### useAsync 异步函数
 
-#### useAsync 异步函数
+当需要执行一个异步函数，可以将要执行的异步函数传入 `useAsync` 中，得到
+
+- 一个异步函数的包裹函数
+- 一个记录异步函数执行 `loading` 响应式数据
+- 等等
 
 ```ts
-import { submitOrder } from '@/api'
 import { useAsync } from 'vue-asyncx'
 
-/**
- * 调用 useAsync('submit', ...)，
- * submit、submitLoading 自动提示
- */
 const { 
-  submit, 
-  submitLoading
-} = useAsync('submit', (params: any) => submitOrder(params))
+  method, 
+  methodLoading,
+} = useAsync(async (a: number, b: number) => a + b)
 
-submit({ content: 'Hello World!' })
+method(1, 1).then(total => console.log(total))
 ```
 
-#### useAsyncData 异步数据
+如果不喜欢默认解构出来的 `method` 与 `methodLoading`，除了解构赋值的重命名，你还可以直接：
+
+```ts
+import { useAsync } from 'vue-asyncx'
+
+const { 
+  sum, 
+  sumLoading
+} = useAsync('sum', async (a: number, b: number) => a + b)
+
+sum(1, 1).then(total => console.log(total))
+```
+
+当你将 `sum` 字符串传入 `useAsync`，结果属性自动替换为 `sum` 和 `sumLoading`，并且，**解构附带 ts 提示**，在结果对象内输入 `s`，相关内容会自动提示。
+
+同时，解构出的 `sum` TS 类型由传入的函数推导出，二者 TS 类型一致。
+
+想象一下在多人合作的大型项目中，通过这种方式约束命名：不同开发人员可以自然地将相同模式的变量名关联在一起，互相理解代码、review 内容变得更简单。
+
+### useAsyncData 异步数据
+
+除了异步函数，另一个常见场景是异步数据。
+
+假设你在开发一个用户详情页，页面通过 `user` 数据渲染，`user` 数据通过 `getUserById` 的 api 获取。
+
+显然，`user` 是一个异步数据，通过 `useAsyncData`，你可以很容易处理这些内容：
 
 ```ts
 import { getUserById } from '@/api'
@@ -50,3 +74,306 @@ const {
   queryUser 
 } = useAsyncData('user', () => getUserById('1'), { immediate: true })
 ```
+
+代码编写流程与思路流程高度一致：
+- 数据命名：页面需要使用异步数据 user => `useAsyncData('user', `
+- 数据获取：user 数据来自 getUserById 接口 => `useAsyncData('user', () => getUserById('1')`
+- 触发获取：进入页面后需要立即获取 user 数据 `useAsyncData('user', () => getUserById('1'), { immediate: true })`
+
+ok，写完上述，页面所需的 `user` 各种相关数据、函数立即出现，想用什么解构什么：
+
+- `user` 响应式变量自动定义并声明
+- 获取 `user` 的函数被自动命名为 `queryUser`
+- 调用 `queryUser` 时的加载状态自动关联到 `queryUserLoading`
+
+只需要在 TS 的提示下，按需解构出页面所需的内容
+
+> `useAsyncData` 底层使用 `useAsync`，即 `useAsync` 的所有能力 `useAsyncData` 都具备。
+> 除 `useAsync` 的能力外，`useAsyncData` 额外支持了一些与数据相关的能力。
+> 二者区别：
+> `useAsync` 关注异步函数，不关注需要长久保留结果值。例如 `submit`、`confirm` 等操作
+> `useAsyncData` 则关注异步数据，异步函数则是数据的获取方式
+
+### immediate 与 watch
+
+注意到上面例子里的 `useAsyncData` 使用了 `immediate` 配置，效果是立即调用 `queryUser`
+
+这个配置来自 vue `watch`，除了 `immediate` 外，**`useAsync` 和 `useAsyncData`** 完整支持了 vue watch 的各种配置
+- 通过 `options.watch` 配置 watch source
+- 通过 `options.watchOptions` 配置 watch 的其它 options
+
+比如常见的通过 props 传递参数，props 参数改变，触发异步数据改变：
+
+```js
+const { 
+  user, 
+  queryUserLoading, 
+  queryUser 
+} = useAsyncData('user', () => getUserById(props.id), { 
+  watch: () => props.id, // 此处用 props 举例，支持所有 vue watch source 的用法
+  immediate: true,
+  watchOptions: {
+    once: true // 此处用 once 举例，支持所有 vue watch options 内的配置
+    // 这里也可以配置 immediate，与上一层的 immediate 效果一致，优先级更高
+  }
+})
+```
+
+实际上即使不配置 `options.watch`，配置 `options.immediate = true` 后内部也是通过 watch 机制触发的立即调用
+
+默认情况下，由 watch 触发的调用不会传递任何参数。watch 的 handler 相当于：`() => queryUser()`。但在 vue 中，watch 的 handler 可以接收新、旧数据以及 `onCleanup`
+
+`useAsync` 和 `useAsyncData` 可以通过配置 `options.watchOptions.handlerCreator` 来自定义 watch handler：
+
+```js
+const { 
+  user, 
+  queryUserLoading, 
+  queryUser 
+} = useAsyncData('user', (id) => getUserById(id), { 
+  watch: () => props.id,
+  immediate: true,
+  watchOptions: {
+    // fn 等价于 queryUser
+    handlerCreator(fn) {
+      // handlerCreator 需要返回 watch 的 handler
+      return (newId, oldId, onCleanup) => {
+        // handler 用法与 vue watch handler 一致，可以排除某些非法调用
+        if (!newId) return
+        fn(newId)
+      }
+    },
+  }
+})
+```
+
+### 调用报错与参数
+
+除了 `loading`，`useAsync` 与 `useAsyncData` 还支持记录调用的 `error` 与 `arguments`，默认状态下，它们的命名是：
+
+```js
+const { 
+  methodError,
+  methodArguments,
+} = useAsync(() => {})
+
+const { 
+  queryDataError,
+  queryDataArguments
+} = useAsyncData(() => {})
+```
+
+与之前例子一致，当自定义命名时，结果随之改变：
+
+```js
+const { 
+  confirmError,
+  confirmArguments,
+} = useAsync('confirm', () => {})
+
+const { 
+  queryUserError,
+  queryUserArguments
+} = useAsyncData('user', () => {})
+```
+
+`error`
+- **最后一次**调用 fn，**且**调用结果失败
+  - 记录异步 fn 的 reject 内容
+  - 记录同步 fn 的 throw 内容
+- **新一次**调用开始后，`error` 自动置空
+
+`arguments`
+- 与 `loading` 一致，调用开始时记录本次调用传入的参数
+- 调用结果出现后，`arguments` 自动置空
+
+### 异步函数乱序响应
+
+```js
+// 使用 useAsync，没有 user 变量
+const { 
+  queryUser,
+  queryUserLoading,
+} = useAsync('queryUser', () => {})
+
+// 或者，使用 useAsyncData
+const { 
+  user,
+  queryUser,
+  queryUserLoading
+} = useAsyncData('user', () => {})
+```
+
+`queryUser` 是个异步函数，由于异步操作时间不定，多次调用情况下会出现乱序响应，考虑下列的时间线顺序：
+
+- **首次调用** `queryUser`，记做 `queryUser1`
+- `queryUser1` 未结束，**再次调用** `queryUser`，记做 `queryUser2`
+- `queryUser2` 先结束
+- `queryUser1` 后结束
+
+即：**依次调用 `queryUser1` 和 `queryUser2`，但 `queryUser2` 先于 `queryUser1` 结束**。这种场景很常见，专门处理很麻烦。
+
+而使用 `useAsync` 和 `useAsyncData`，你无需再考虑这类问题，方法会自动帮你处理。
+
+以上述例子举例：
+
+- `queryUser1` 开始时，`queryUserLoading.value` 为 `true`
+- **`queryUser2` 结束时**，`queryUserLoading.value` 为 `false`
+
+对于 `useAsyncData`，`queryUser` 对应的 `user` 数据：
+
+- `user.value` 将始终以 `queryUser2` 的结果为准（取**最晚的调用**产生的结果）
+- 即使 `queryUser1` 产生结果的时间更晚，但 `queryUser1` 的结果不会更新到 `user.value` 上
+- `queryUser1` 的结果会被自动舍弃，因为这是一个“过期的”数据
+
+> 另一种处理重复调用的方式是不允许在上次调用未结束时再次调用
+> 
+> 由于 `useAsync` 和 `useAsyncData` 提供了响应式的 `loading`，对于常用组件库，向按钮传入 `loading` 状态或在 `disabled` 属性中添加 `loading` 判断即可轻松避免
+>
+> 此处讨论的是因数据源变动导致异步数据需要刷新的场景，比如 `userId` 短时间从 `1` 切换到 `2`，`user` 数据需要做对应刷新
+
+### 数据过期
+
+> 过期数据标注是 `useAsyncData` 独有功能
+
+```js
+const { 
+  user,
+  queryUser,
+  queryUserError,
+  userExpired
+} = useAsyncData('user', () => {})
+```
+
+假设是以下时间线：
+
+- 首次调用 `queryUser`，记做 `queryUser1`
+- `queryUser1` 未结束，再次调用 `queryUser`，记做 `queryUser2`
+- `queryUser2` 先结束，**但发生报错**
+- `queryUser1` 后结束
+
+此时：
+- `queryUser2` 的错误会被记录到 `queryUserError.value` 上
+- `queryUser1` 的结果**会被更新到** `user.value` 上
+- `userExpired.value` 会被设置为 `true`，表明当前的 `user.value` 是个过期数据（因为 `user.value` 来自`queryUser1`，而最新的结果是 `queryUser2` 的报错）
+
+> 大多数情况下，无需考虑 `userExpired.value` 的问题，因为它只会在 `queryUserError.value` 出现时出现，优先处理 `queryUserError.value` 往往是更好的做法
+
+> `userExpired.value` 为 `true` 后，直到下次调用更新 `user.value` 前，`userExpired.value` 将一直保持 `true` 状态。
+> 原因：`userExpired.value` 为 `true` 后，虽然再次调用了 `queryUser`，但在 `user.value` 再次更新前，`user.value` 当前的值仍是“过期的”珊瑚橘
+
+> 由于乱序的问题，如果在 `queryUser1` 时使用了 `.then(res => ...)`，`res` 的值是 `queryUser1` 的结果，与 `user.value` 不一致，这是符合预期的。
+
+### 异步数据的中途获取与更新
+
+> 异步数据中途获取与更新是 `useAsyncData` 独有功能
+
+在某些场景下，我们希望异步数据可以在异步获取过程中更新，无需等到获取过程完全结束。
+
+可以通过 `options.enhanceFirstArgument = true` 支持这种需求。
+
+```js
+import { unFirstArgumentEnhanced, useAsyncData } from 'vue-asyncx'
+
+const wait = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms))
+
+const { 
+  progress,
+  queryProgress
+} = useAsyncData('progress', async (init?: number) => {
+  const { getData, updateData } = unFirstArgumentEnhanced(init)
+  init = unFirstArgumentEnhanced(init).firstArgument
+  updateData(init || 0)
+  await wait(100)
+  updateData(50)
+  await wait(100)
+  return 100
+}, { 
+  enhanceFirstArgument: true
+})
+
+queryProgress(10)
+```
+
+在上述代码的最后一行调用 `queryProgress(10)` 后：
+- `progress.value` 会立即更新为 `10`
+- 100ms 后 `progress.value` 更新为 `50`
+- 再过 100ms 后，`progress.value` 更新为 `100`，本次调用结束
+
+注意到在传入 `useAsyncData` 的 `fn` 内，有
+
+```js
+const { getData, updateData } = unFirstArgumentEnhanced(init)
+init = unFirstArgumentEnhanced(init).firstArgument
+```
+
+原理：
+
+当 `options.enhanceFirstArgument = true` 后
+- `fn` 的首个参数 `init` 便被拓展为 `FirstArgumentEnhanced` 类型。
+- 实际调用 `queryProgress(10)` 时传入的 `10` 在 `fn` 内部通过 `init` 接收时变成了 `{ getData, updateData, firstArgument }`，`10` 被赋在了 `init.firstArgument` 上
+- `unFirstArgumentEnhanced(init)` 先解构出 `getData` 和 `updateData`，再将 `init` 重新赋值为传入的 `10`
+
+> 也就是在 `fn` 内部可以直接通过
+> `const { getData, updateData, firstArgument } = init`
+> 但是这样写需要自行处理 TS 类型问题，因此提供了 `unFirstArgumentEnhanced` 辅助函数。
+
+只需要记住
+
+- 可以像以往一般正常定义 `fn`、调用 `queryProgress`
+- 在 `fn` 内部实现的最上方，加上上述的两行代码，余下即可正常使用
+
+如果 `fn` 本身不接收参数，那么可以改成普通函数，通过 `arguments[0]` 传递：
+
+```js
+const { 
+  progress,
+  queryProgress
+} = useAsyncData('progress', async function () {
+  const { getData, updateData } = unFirstArgumentEnhanced(arguments[0])
+  updateData(0)
+  await wait(100)
+  updateData(50)
+  await wait(100)
+  return 100
+}, { 
+  enhanceFirstArgument: true
+})
+
+queryProgress()
+```
+
+在某些情况下，需要区分 `queryProgress()` 与 `queryProgress(undefined)`，可以通过：
+
+```js
+const firstArgumentEnhanced = unFirstArgumentEnhanced(arguments[0])
+const undefinedOrEmpty = 'firstArgument' in firstArgumentEnhanced
+```
+
+即
+
+- `firstArgumentEnhanced` 存在 `firstArgument` 属性时，是 `queryProgress(undefined)`
+- `firstArgumentEnhanced` 不存在 `firstArgument` 属性时，是 `queryProgress()`
+
+本块 api 设计思考过程见
+
+- [rfc1-async-data-update](./docs/rfc1-async-data-update.md)
+
+其它
+
+- `getData` 总是返回最新的数据
+- `setData` 不保证设置成功（比如发生了乱序响应的情况）
+- 接上，`setData` 支持处理乱序响应，一旦有新的调用触发 `setData`，旧调用的 `setData` 操作会被忽略
+
+## 理念
+
+在“干净架构”里，函数拆分的原则是：一个函数应该做且只做一件事
+
+- 对于传入 `useAsyncData` 的函数 `fn` 而言，唯一需要关注的就是如何设置 `data` 的值
+  - 对于在 `data` 值初始化后需要干的其它事情，可以在 `useAsyncData` **外部** 通过 vue 的 watch data 去触发
+- 对于 `useAsyncData` 整体而言，我们将与 `data` 值相关的代码都聚集在了一起
+  - loading、error、expired、arguments 等数据与 data 或 fn 紧密相关
+  - watch 设置了 fn 的调用时机，即初始化 data 的时机
+
+通过上面的约定，很容易写出“干净”的函数与高内聚的代码块，提高代码可读性
+

package/dist/vue-asyncx.d.ts

@@ -5,7 +5,7 @@ import { WatchSource } from 'vue';
 
 declare type FirstArgumentEnhanced<T = any, D = any> = {
     [FLAG_FIRST_ARGUMENT_ENHANCED]: true;
-    firstArgument: T;
+    firstArgument?: T;
     getData: () => D;
     updateData: (v: D) => void;
 };
@@ -14,7 +14,7 @@ declare const FLAG_FIRST_ARGUMENT_ENHANCED = "__va_fae";
 
 declare type StringDefaultWhenEmpty<S extends string, D extends string> = S extends '' ? D : S;
 
-export declare function unFirstArgumentEnhanced<Arg = any, Data = any>(arg: Arg): FirstArgumentEnhanced<Arg, Data>;
+export declare function unFirstArgumentEnhanced<Arg = any, Data = any>(arg: Arg): Arg extends undefined ? FirstArgumentEnhanced<Arg, Data> : Required<FirstArgumentEnhanced<Arg, Data>>;
 
 declare function useAsync<Fn extends (...args: any) => any>(fn: Fn, options?: UseAsyncOptions<Fn>): UseAsyncResult<Fn, 'method'>;
 

package/dist/vue-asyncx.js

@@ -1,47 +1,47 @@
 var L = Object.defineProperty, O = Object.defineProperties;
 var b = Object.getOwnPropertyDescriptors;
 var F = Object.getOwnPropertySymbols;
-var _ = Object.prototype.hasOwnProperty, T = Object.prototype.propertyIsEnumerable;
-var U = (e, n, t) => n in e ? L(e, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[n] = t, B = (e, n) => {
-  for (var t in n || (n = {}))
-    _.call(n, t) && U(e, t, n[t]);
+var B = Object.prototype.hasOwnProperty, $ = Object.prototype.propertyIsEnumerable;
+var T = (e, n, r) => n in e ? L(e, n, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[n] = r, w = (e, n) => {
+  for (var r in n || (n = {}))
+    B.call(n, r) && T(e, r, n[r]);
   if (F)
-    for (var t of F(n))
-      T.call(n, t) && U(e, t, n[t]);
+    for (var r of F(n))
+      $.call(n, r) && T(e, r, n[r]);
   return e;
-}, $ = (e, n) => O(e, b(n));
-var w = (e, n) => {
-  var t = {};
+}, C = (e, n) => O(e, b(n));
+var U = (e, n) => {
+  var r = {};
   for (var a in e)
-    _.call(e, a) && n.indexOf(a) < 0 && (t[a] = e[a]);
+    B.call(e, a) && n.indexOf(a) < 0 && (r[a] = e[a]);
   if (e != null && F)
     for (var a of F(e))
-      n.indexOf(a) < 0 && T.call(e, a) && (t[a] = e[a]);
-  return t;
+      n.indexOf(a) < 0 && $.call(e, a) && (r[a] = e[a]);
+  return r;
 };
 import { ref as E, watch as x, computed as N } from "vue";
 function j(...e) {
   var v;
   if (!Array.isArray(e) || !e.length) throw TypeError("参数错误：未传递");
-  const { name: n, fn: t, options: a } = typeof e[0] == "function" ? { name: "method", fn: e[0], options: e[1] } : { name: e[0] || "method", fn: e[1], options: e[2] };
+  const { name: n, fn: r, options: a } = typeof e[0] == "function" ? { name: "method", fn: e[0], options: e[1] } : { name: e[0] || "method", fn: e[1], options: e[2] };
   if (typeof n != "string") throw TypeError("参数错误：name");
-  if (typeof t != "function") throw TypeError("参数错误：fn");
+  if (typeof r != "function") throw TypeError("参数错误：fn");
   const p = E(!1), m = E(), s = E(), u = { called: 0, finished: 0 };
   function y(...h) {
-    const d = ++u.called, A = (r) => {
-      s.value = void 0, p.value = !0, m.value = r;
-    }, c = (r, { scene: i, sn: o }) => {
-      o > u.finished && (u.finished = o), u.called === u.finished && (i === "error" && (s.value = r), p.value = !1, m.value = void 0);
+    const d = ++u.called, A = (t) => {
+      s.value = void 0, p.value = !0, m.value = t;
+    }, c = (t, { scene: i, sn: o }) => {
+      o > u.finished && (u.finished = o), u.called === u.finished && (i === "error" && (s.value = t), p.value = !1, m.value = void 0);
     };
     A(h);
     try {
-      const r = t(...h);
-      return r instanceof Promise ? r.then(
+      const t = r(...h);
+      return t instanceof Promise ? t.then(
         () => c(void 0, { scene: "normal", sn: d }),
         (i) => c(i, { scene: "error", sn: d })
-      ) : c(void 0, { scene: "normal", sn: d }), r;
-    } catch (r) {
-      throw c(r, { scene: "error", sn: d }), r;
+      ) : c(void 0, { scene: "normal", sn: d }), t;
+    } catch (t) {
+      throw c(t, { scene: "error", sn: d }), t;
     }
   }
   if (a) {
@@ -50,7 +50,7 @@ function j(...e) {
       {},
       "immediate" in a ? { immediate: a.immediate } : {},
       (v = a.watchOptions) != null ? v : {}
-    ), { handlerCreator: d } = l, A = w(l, ["handlerCreator"]), { watch: c } = a, i = (() => {
+    ), { handlerCreator: d } = l, A = U(l, ["handlerCreator"]), { watch: c } = a, i = (() => {
       const o = () => y();
       if (typeof d != "function") return o;
       try {
@@ -71,16 +71,16 @@ function j(...e) {
 }
 function G(e) {
   if (!e) return "";
-  const n = e[0], t = e.slice(1);
-  return n.toUpperCase() + t;
+  const n = e[0], r = e.slice(1);
+  return n.toUpperCase() + r;
 }
 const D = "__va_fae";
 function z(...e) {
   if (!Array.isArray(e) || !e.length) throw TypeError("参数错误：未传递");
-  const { name: n, fn: t, options: a } = typeof e[0] == "function" ? { name: "data", fn: e[0], options: e[1] } : { name: e[0] || "data", fn: e[1], options: e[2] };
+  const { name: n, fn: r, options: a } = typeof e[0] == "function" ? { name: "data", fn: e[0], options: e[1] } : { name: e[0] || "data", fn: e[1], options: e[2] };
   if (typeof n != "string") throw TypeError("参数错误：name");
-  if (typeof t != "function") throw TypeError("参数错误：fn");
-  const c = a || {}, { enhanceFirstArgument: p } = c, m = w(c, ["enhanceFirstArgument"]), s = E({
+  if (typeof r != "function") throw TypeError("参数错误：fn");
+  const c = a || {}, { enhanceFirstArgument: p } = c, m = U(c, ["enhanceFirstArgument"]), s = E({
     // 调用序号（即：fn 第 called 次调用）
     called: 0,
     // 完成序号（即：fn 第 finished 次调用完成）
@@ -90,30 +90,30 @@ function z(...e) {
     // 数据完成更新序号（即：data 数据由第 dataUpdateByFinished 次调用完成后更新）
     dataUpdateByFinished: 0
   }), u = E(), y = N(() => !(s.value.dataUpdateByFinished >= s.value.finished || s.value.dataUpdateByCalled > s.value.finished));
-  function v(r, { sn: i, scene: o }) {
-    i < s.value.dataUpdateByCalled || (u.value = r, s.value.dataUpdateByCalled = i, o === "finish" && (s.value.dataUpdateByFinished = i));
+  function v(t, { sn: i, scene: o }) {
+    i < s.value.dataUpdateByCalled || (u.value = t, s.value.dataUpdateByCalled = i, o === "finish" && (s.value.dataUpdateByFinished = i));
   }
-  function l(r, { scene: i, sn: o }) {
-    i === "normal" && v(r, { sn: o, scene: "finish" }), o > s.value.finished && (s.value.finished = o);
+  function l(t, { scene: i, sn: o }) {
+    i === "normal" && v(t, { sn: o, scene: "finish" }), o > s.value.finished && (s.value.finished = o);
   }
-  function h(r, {
+  function h(t, {
     enhanceFirstArgument: i,
     sn: o
   }) {
-    if (!i) return r;
-    const [f, ...H] = r;
-    return [{
-      [D]: !0,
-      firstArgument: f,
+    if (!i) return t;
+    const [f, ...H] = t;
+    return [C(w({
+      [D]: !0
+    }, t.length ? { firstArgument: f } : {}), {
       getData: () => u.value,
-      updateData: (C) => (v(C, { sn: o, scene: "update" }), C)
-    }, ...H];
+      updateData: (_) => (v(_, { sn: o, scene: "update" }), _)
+    }), ...H];
   }
-  function d(...r) {
+  function d(...t) {
     const i = ++s.value.called;
-    r = h(r, { enhanceFirstArgument: p, sn: i });
+    t = h(t, { enhanceFirstArgument: p, sn: i });
     try {
-      const o = t(...r);
+      const o = r(...t);
       return o instanceof Promise ? o.then(
         // promise 正常结束
         (f) => l(f, { scene: "normal", sn: i }),
@@ -125,7 +125,7 @@ function z(...e) {
     }
   }
   const A = j(`query${G(n)}`, d, m);
-  return $(B({}, A), {
+  return C(w({}, A), {
     [n]: u,
     [`${n}Expired`]: y
   });

package/dist/vue-asyncx.umd.cjs

@@ -1 +1 @@
-(function(e,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(e=typeof globalThis!="undefined"?globalThis:e||self,n(e.VueAsyncx={},e.Vue))})(this,function(e,n){"use strict";var P=Object.defineProperty,q=Object.defineProperties;var x=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var D=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable;var b=(e,n,a)=>n in e?P(e,n,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[n]=a,$=(e,n)=>{for(var a in n||(n={}))D.call(n,a)&&b(e,a,n[a]);if(C)for(var a of C(n))O.call(n,a)&&b(e,a,n[a]);return e},j=(e,n)=>q(e,x(n));var U=(e,n)=>{var a={};for(var c in e)D.call(e,c)&&n.indexOf(c)<0&&(a[c]=e[c]);if(e!=null&&C)for(var c of C(e))n.indexOf(c)<0&&O.call(e,c)&&(a[c]=e[c]);return a};function a(...t){var w;if(!Array.isArray(t)||!t.length)throw TypeError("参数错误：未传递");const{name:f,fn:p,options:y}=typeof t[0]=="function"?{name:"method",fn:t[0],options:t[1]}:{name:t[0]||"method",fn:t[1],options:t[2]};if(typeof f!="string")throw TypeError("参数错误：name");if(typeof p!="function")throw TypeError("参数错误：fn");const v=n.ref(!1),E=n.ref(),s=n.ref(),l={called:0,finished:0};function F(...A){const h=++l.called,T=i=>{s.value=void 0,v.value=!0,E.value=i},u=(i,{scene:o,sn:r})=>{r>l.finished&&(l.finished=r),l.called===l.finished&&(o==="error"&&(s.value=i),v.value=!1,E.value=void 0)};T(A);try{const i=p(...A);return i instanceof Promise?i.then(()=>u(void 0,{scene:"normal",sn:h}),o=>u(o,{scene:"error",sn:h})):u(void 0,{scene:"normal",sn:h}),i}catch(i){throw u(i,{scene:"error",sn:h}),i}}if(y){const A=()=>{},m=Object.assign({},"immediate"in y?{immediate:y.immediate}:{},(w=y.watchOptions)!=null?w:{}),{handlerCreator:h}=m,T=U(m,["handlerCreator"]),{watch:u}=y,o=(()=>{const r=()=>F();if(typeof h!="function")return r;try{const d=h(F);return typeof d=="function"?d:r}catch(d){return r}})();n.watch(u!=null?u:A,o,T)}return{[f]:F,[`${f}Loading`]:v,[`${f}Arguments`]:E,[`${f}Error`]:s}}function c(t){if(!t)return"";const f=t[0],p=t.slice(1);return f.toUpperCase()+p}const _="__va_fae";function H(...t){if(!Array.isArray(t)||!t.length)throw TypeError("参数错误：未传递");const{name:f,fn:p,options:y}=typeof t[0]=="function"?{name:"data",fn:t[0],options:t[1]}:{name:t[0]||"data",fn:t[1],options:t[2]};if(typeof f!="string")throw TypeError("参数错误：name");if(typeof p!="function")throw TypeError("参数错误：fn");const u=y||{},{enhanceFirstArgument:v}=u,E=U(u,["enhanceFirstArgument"]),s=n.ref({called:0,finished:0,dataUpdateByCalled:0,dataUpdateByFinished:0}),l=n.ref(),F=n.computed(()=>!(s.value.dataUpdateByFinished>=s.value.finished||s.value.dataUpdateByCalled>s.value.finished));function w(i,{sn:o,scene:r}){o<s.value.dataUpdateByCalled||(l.value=i,s.value.dataUpdateByCalled=o,r==="finish"&&(s.value.dataUpdateByFinished=o))}function m(i,{scene:o,sn:r}){o==="normal"&&w(i,{sn:r,scene:"finish"}),r>s.value.finished&&(s.value.finished=r)}function A(i,{enhanceFirstArgument:o,sn:r}){if(!o)return i;const[d,...N]=i;return[{[_]:!0,firstArgument:d,getData:()=>l.value,updateData:B=>(w(B,{sn:r,scene:"update"}),B)},...N]}function h(...i){const o=++s.value.called;i=A(i,{enhanceFirstArgument:v,sn:o});try{const r=p(...i);return r instanceof Promise?r.then(d=>m(d,{scene:"normal",sn:o}),d=>m(d,{scene:"error",sn:o})):m(r,{scene:"normal",sn:o}),r}catch(r){throw m(r,{scene:"error",sn:o}),r}}const T=a(`query${c(f)}`,h,E);return j($({},T),{[f]:l,[`${f}Expired`]:F})}function L(t){if(typeof t!="object"||!t||!t[_])throw Error("请配置 options.enhanceFirstArgument = true");return t}e.unFirstArgumentEnhanced=L,e.useAsync=a,e.useAsyncData=H,e.useAsyncFunction=a,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
+(function(e,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(e=typeof globalThis!="undefined"?globalThis:e||self,n(e.VueAsyncx={},e.Vue))})(this,function(e,n){"use strict";var P=Object.defineProperty,q=Object.defineProperties;var x=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var $=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable;var O=(e,n,a)=>n in e?P(e,n,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[n]=a,U=(e,n)=>{for(var a in n||(n={}))$.call(n,a)&&O(e,a,n[a]);if(C)for(var a of C(n))j.call(n,a)&&O(e,a,n[a]);return e},_=(e,n)=>q(e,x(n));var B=(e,n)=>{var a={};for(var c in e)$.call(e,c)&&n.indexOf(c)<0&&(a[c]=e[c]);if(e!=null&&C)for(var c of C(e))n.indexOf(c)<0&&j.call(e,c)&&(a[c]=e[c]);return a};function a(...t){var w;if(!Array.isArray(t)||!t.length)throw TypeError("参数错误：未传递");const{name:f,fn:p,options:y}=typeof t[0]=="function"?{name:"method",fn:t[0],options:t[1]}:{name:t[0]||"method",fn:t[1],options:t[2]};if(typeof f!="string")throw TypeError("参数错误：name");if(typeof p!="function")throw TypeError("参数错误：fn");const v=n.ref(!1),E=n.ref(),s=n.ref(),l={called:0,finished:0};function F(...A){const h=++l.called,T=i=>{s.value=void 0,v.value=!0,E.value=i},u=(i,{scene:o,sn:r})=>{r>l.finished&&(l.finished=r),l.called===l.finished&&(o==="error"&&(s.value=i),v.value=!1,E.value=void 0)};T(A);try{const i=p(...A);return i instanceof Promise?i.then(()=>u(void 0,{scene:"normal",sn:h}),o=>u(o,{scene:"error",sn:h})):u(void 0,{scene:"normal",sn:h}),i}catch(i){throw u(i,{scene:"error",sn:h}),i}}if(y){const A=()=>{},m=Object.assign({},"immediate"in y?{immediate:y.immediate}:{},(w=y.watchOptions)!=null?w:{}),{handlerCreator:h}=m,T=B(m,["handlerCreator"]),{watch:u}=y,o=(()=>{const r=()=>F();if(typeof h!="function")return r;try{const d=h(F);return typeof d=="function"?d:r}catch(d){return r}})();n.watch(u!=null?u:A,o,T)}return{[f]:F,[`${f}Loading`]:v,[`${f}Arguments`]:E,[`${f}Error`]:s}}function c(t){if(!t)return"";const f=t[0],p=t.slice(1);return f.toUpperCase()+p}const b="__va_fae";function H(...t){if(!Array.isArray(t)||!t.length)throw TypeError("参数错误：未传递");const{name:f,fn:p,options:y}=typeof t[0]=="function"?{name:"data",fn:t[0],options:t[1]}:{name:t[0]||"data",fn:t[1],options:t[2]};if(typeof f!="string")throw TypeError("参数错误：name");if(typeof p!="function")throw TypeError("参数错误：fn");const u=y||{},{enhanceFirstArgument:v}=u,E=B(u,["enhanceFirstArgument"]),s=n.ref({called:0,finished:0,dataUpdateByCalled:0,dataUpdateByFinished:0}),l=n.ref(),F=n.computed(()=>!(s.value.dataUpdateByFinished>=s.value.finished||s.value.dataUpdateByCalled>s.value.finished));function w(i,{sn:o,scene:r}){o<s.value.dataUpdateByCalled||(l.value=i,s.value.dataUpdateByCalled=o,r==="finish"&&(s.value.dataUpdateByFinished=o))}function m(i,{scene:o,sn:r}){o==="normal"&&w(i,{sn:r,scene:"finish"}),r>s.value.finished&&(s.value.finished=r)}function A(i,{enhanceFirstArgument:o,sn:r}){if(!o)return i;const[d,...N]=i;return[_(U({[b]:!0},i.length?{firstArgument:d}:{}),{getData:()=>l.value,updateData:D=>(w(D,{sn:r,scene:"update"}),D)}),...N]}function h(...i){const o=++s.value.called;i=A(i,{enhanceFirstArgument:v,sn:o});try{const r=p(...i);return r instanceof Promise?r.then(d=>m(d,{scene:"normal",sn:o}),d=>m(d,{scene:"error",sn:o})):m(r,{scene:"normal",sn:o}),r}catch(r){throw m(r,{scene:"error",sn:o}),r}}const T=a(`query${c(f)}`,h,E);return _(U({},T),{[f]:l,[`${f}Expired`]:F})}function L(t){if(typeof t!="object"||!t||!t[b])throw Error("请配置 options.enhanceFirstArgument = true");return t}e.unFirstArgumentEnhanced=L,e.useAsync=a,e.useAsyncData=H,e.useAsyncFunction=a,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-asyncx",
-  "version": "1.5.0",
+  "version": "1.5.2",
   "description": "",
   "type": "module",
   "types": "dist/vue-asyncx.d.ts",
@@ -44,6 +44,7 @@
     "build": "vite build",
     "test:unit": "vitest",
     "test:unit:coverage": "vitest run --coverage",
-    "test": "pnpm run test:unit"
+    "test": "pnpm run test:unit",
+    "prepublish": "pnpm run build"
   }
 }