@hzab/list-render 1.9.1 → 1.9.2-beta

package/CHANGELOG.md

@@ -1,4 +1,8 @@
-# @hzab/list-render@1.9.1
+# @hzab/list-render@1.9.3
+
+feat: 列表请求取消上一次列表请求，解决数据返回先后顺序导致展示异常问题
+
+# @hzab/list-render@1.9.2
 
 fix: Drawer 模式 首次编辑 scenario 状态不正确问题修复
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hzab/list-render",
-  "version": "1.9.1",
+  "version": "1.9.2-beta",
   "description": "",
   "main": "src",
   "scripts": {
@@ -20,7 +20,7 @@
   "license": "ISC",
   "devDependencies": {
     "@ant-design/icons": "^4.8.1",
-    "@hzab/data-model": "^1.6.0",
+    "@hzab/data-model": "^1.7.2",
     "@hzab/form-render": "^1.1.5",
     "@hzab/schema-descriptions": "^1.0.0",
     "@hzab/webpack-config": "^0.7.2",
@@ -40,7 +40,7 @@
     "@formily/core": "2.3.1",
     "@formily/react": "2.3.1",
     "@formily/reactive-react": "2.3.1",
-    "@hzab/data-model": ">=1.5.0",
+    "@hzab/data-model": ">=1.7.2",
     "@hzab/form-render": ">=1.0.0",
     "@hzab/schema-descriptions": ">=1.0.0",
     "antd": "4.x",

package/src/FormModal/index.tsx

@@ -36,8 +36,8 @@ export function FormModal(props, parentRef) {
   const FormSlot = useMemo(() => props.Slots?.FormSlot, [props.Slots?.FormSlot]);
 
   function show(formData = props.formInitialValues, title, scenario = "create") {
-    setOpen(true);
     scenarioRef.current = scenario || "create";
+    setOpen(true);
     // 处理 formRef.current 为 undefined 的问题
     if (formRef.current?.formRender?.setValues) {
       formRef.current?.formRender?.setValues(formData);

package/src/list-render.jsx

@@ -5,6 +5,7 @@ model 不要定义在组件外部，避免出现 query 异常的情况。
 import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
 import { Button, message } from "antd";
 import _ from "lodash";
+import { getCancelTokenSource } from "@hzab/data-model/src/axios";
 
 import QueryRender from "./query-render";
 import Pagination from "./pagination-render";
@@ -48,6 +49,7 @@ const ListRender = forwardRef(function (props, parentRef) {
   const formQueryRef = useRef({});
   const paginationQueryRef = useRef({ pageNum: 1, pageSize: 10 });
   const useFormData = _useFormData ?? dialogConf.useFormData ?? modalConf?.useFormData;
+  const getListSourceRef = useRef();
 
   useImperativeHandle(parentRef, () => ({
     getList,
@@ -129,8 +131,20 @@ const ListRender = forwardRef(function (props, parentRef) {
 
     model.query = mergedQueries;
 
+    // 取消上一次请求
+    getListSourceRef.current?.cancel("取消上一次请求");
+
+    // 重新获取 source
+    getListSourceRef.current = getCancelTokenSource();
+
     model
-      ?.getList(mergedQueries)
+      ?.getList(
+        mergedQueries,
+        {},
+        {
+          cancelToken: getListSourceRef.current?.token,
+        },
+      )
       .then((res) => {
         setList(res.list);
         setTotal(res.pagination?.total);
@@ -138,6 +152,10 @@ const ListRender = forwardRef(function (props, parentRef) {
         setListLoading(false);
       })
       .catch((err) => {
+        if (axios.isCancel(error)) {
+          console.log("请求已取消:", error.message);
+          return;
+        }
         console.error(err);
         handleMessage(err._message);
         setListLoading(false);