@hzab/list-render 1.9.2 → 1.9.3

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+# @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.2",
+  "version": "1.9.3",
   "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.4",
     "@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.4",
     "@hzab/form-render": ">=1.0.0",
     "@hzab/schema-descriptions": ">=1.0.0",
     "antd": "4.x",

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 axios, { 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,18 +131,35 @@ const ListRender = forwardRef(function (props, parentRef) {
 
     model.query = mergedQueries;
 
+    // 取消上一次请求
+    getListSourceRef.current?.cancel({ code: 601, message: "取消上一次请求" });
+
+    // 重新获取 source
+    getListSourceRef.current = getCancelTokenSource();
+
     model
-      ?.getList(mergedQueries)
+      ?.getList(
+        mergedQueries,
+        {},
+        {
+          cancelToken: getListSourceRef.current?.token,
+        },
+      )
       .then((res) => {
+        getListSourceRef.current = null;
         setList(res.list);
         setTotal(res.pagination?.total);
         props.onGetListEnd && props.onGetListEnd(res);
         setListLoading(false);
       })
       .catch((err) => {
-        console.error(err);
-        handleMessage(err._message);
+        if (axios.isCancel(err)) {
+          console.info(`请求已取消:`, "", err.message);
+          return Promise.reject(err);
+        }
+        handleMessage(err?._message);
         setListLoading(false);
+        return Promise.reject(err);
       });
   }
 
@@ -214,6 +233,7 @@ const ListRender = forwardRef(function (props, parentRef) {
         .catch((err) => {
           console.error("err", err);
           handleMessage(err._message);
+          return Promise.reject(err);
         });
     } else {
       handleDetail(row, row[idKey]);
@@ -241,6 +261,7 @@ const ListRender = forwardRef(function (props, parentRef) {
         .catch((err) => {
           console.error("err", err);
           handleMessage(err._message);
+          return Promise.reject(err);
         });
     } else {
       handleEdit(row, row[idKey]);
@@ -291,6 +312,7 @@ const ListRender = forwardRef(function (props, parentRef) {
       })
       .catch((err) => {
         handleMessage(err._message);
+        return Promise.reject(err);
       });
   }