@sheinx/hooks 3.10.3-beta.2 → 3.10.3-beta.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/use-table/use-table-columns.d.ts +4 -0
- package/cjs/components/use-table/use-table-columns.d.ts.map +1 -1
- package/cjs/components/use-table/use-table-columns.js +18 -0
- package/esm/components/use-table/use-table-columns.d.ts +4 -0
- package/esm/components/use-table/use-table-columns.d.ts.map +1 -1
- package/esm/components/use-table/use-table-columns.js +18 -0
- package/package.json +1 -1
|
@@ -6,6 +6,10 @@ export interface UseColumnsProps<Data> {
|
|
|
6
6
|
showCheckbox?: boolean;
|
|
7
7
|
virtualColumn?: boolean | VirtualColumnConfig;
|
|
8
8
|
scrollRef: React.RefObject<HTMLElement>;
|
|
9
|
+
/**
|
|
10
|
+
* columns 引用变化但逐列浅比较都相等时,复用上一次的格式化结果(行级 memo 的前置条件)
|
|
11
|
+
*/
|
|
12
|
+
reuseEqualColumns?: boolean;
|
|
9
13
|
}
|
|
10
14
|
export type RxpandHideColType = {
|
|
11
15
|
hide?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-table-columns.d.ts","sourceRoot":"","sources":["use-table-columns.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE3F,OAAO,KAA+C,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"use-table-columns.d.ts","sourceRoot":"","sources":["use-table-columns.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE3F,OAAO,KAA+C,MAAM,OAAO,CAAC;AAGpE,MAAM,WAAW,eAAe,CAAC,IAAI;IACnC,OAAO,CAAC,EAAE,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC;IAClC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;IAC9C,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAgBD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,EAAE,QAAQ,GAAG,YAAY,CAAC;IAC9B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC,MAAM,KAAK,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IAC3E,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD,GAAG,IAAI,CAAC;AAKT,QAAA,MAAM,UAAU;;;;wBAiGkC,MAAM;;;;;CA2GvD,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -7,6 +7,7 @@ exports.default = void 0;
|
|
|
7
7
|
var _immer = require("../../utils/immer");
|
|
8
8
|
var _react = require("react");
|
|
9
9
|
var _usePersistFn = _interopRequireDefault(require("../../common/use-persist-fn"));
|
|
10
|
+
var _shallowEqual = _interopRequireDefault(require("../../utils/shallow-equal"));
|
|
10
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
12
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
12
13
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
@@ -20,6 +21,12 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|
|
20
21
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
21
22
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
22
23
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
24
|
+
// 逐列浅比较:业务常见写法 columns.map(c => ({ ...c })) 每次都会产生新对象,但内容(含 render 引用)不变
|
|
25
|
+
var isColumnsShallowEqual = function isColumnsShallowEqual(a, b) {
|
|
26
|
+
return a.length === b.length && a.every(function (c, i) {
|
|
27
|
+
return (0, _shallowEqual.default)(c, b[i]);
|
|
28
|
+
});
|
|
29
|
+
};
|
|
23
30
|
var getHideExpandCol = function getHideExpandCol() {
|
|
24
31
|
var cols = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
25
32
|
var expandCol = cols.find(function (col) {
|
|
@@ -55,6 +62,8 @@ var useColumns = function useColumns(props) {
|
|
|
55
62
|
var _useRef = (0, _react.useRef)({
|
|
56
63
|
cachedColumns: null,
|
|
57
64
|
oldColumns: null,
|
|
65
|
+
oldShowCheckbox: undefined,
|
|
66
|
+
columnsSnapshot: null,
|
|
58
67
|
groupLevel: 0,
|
|
59
68
|
expandHideCol: null
|
|
60
69
|
}),
|
|
@@ -66,6 +75,11 @@ var useColumns = function useColumns(props) {
|
|
|
66
75
|
if (columnsA === context.oldColumns) {
|
|
67
76
|
return context.cachedColumns;
|
|
68
77
|
}
|
|
78
|
+
if (props.reuseEqualColumns && context.columnsSnapshot && context.cachedColumns && context.oldShowCheckbox === props.showCheckbox && isColumnsShallowEqual(columnsA, context.columnsSnapshot)) {
|
|
79
|
+
context.oldColumns = columnsA;
|
|
80
|
+
return context.cachedColumns;
|
|
81
|
+
}
|
|
82
|
+
context.oldShowCheckbox = props.showCheckbox;
|
|
69
83
|
context.expandHideCol = getHideExpandCol(columnsA);
|
|
70
84
|
var columns = columnsA.filter(function (c) {
|
|
71
85
|
return _typeof(c) === 'object';
|
|
@@ -101,6 +115,10 @@ var useColumns = function useColumns(props) {
|
|
|
101
115
|
});
|
|
102
116
|
});
|
|
103
117
|
context.oldColumns = columnsA;
|
|
118
|
+
// 与快照比较而非与旧数组比较:列对象被原地修改时旧数组里也是同一个对象,比较不出差异
|
|
119
|
+
context.columnsSnapshot = props.reuseEqualColumns ? columnsA.map(function (c) {
|
|
120
|
+
return c && _typeof(c) === 'object' ? _objectSpread({}, c) : c;
|
|
121
|
+
}) : null;
|
|
104
122
|
return context.cachedColumns;
|
|
105
123
|
});
|
|
106
124
|
var columns = getColumns(propsColumns) || [];
|
|
@@ -6,6 +6,10 @@ export interface UseColumnsProps<Data> {
|
|
|
6
6
|
showCheckbox?: boolean;
|
|
7
7
|
virtualColumn?: boolean | VirtualColumnConfig;
|
|
8
8
|
scrollRef: React.RefObject<HTMLElement>;
|
|
9
|
+
/**
|
|
10
|
+
* columns 引用变化但逐列浅比较都相等时,复用上一次的格式化结果(行级 memo 的前置条件)
|
|
11
|
+
*/
|
|
12
|
+
reuseEqualColumns?: boolean;
|
|
9
13
|
}
|
|
10
14
|
export type RxpandHideColType = {
|
|
11
15
|
hide?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-table-columns.d.ts","sourceRoot":"","sources":["use-table-columns.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE3F,OAAO,KAA+C,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"use-table-columns.d.ts","sourceRoot":"","sources":["use-table-columns.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE3F,OAAO,KAA+C,MAAM,OAAO,CAAC;AAGpE,MAAM,WAAW,eAAe,CAAC,IAAI;IACnC,OAAO,CAAC,EAAE,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC;IAClC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;IAC9C,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAgBD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,EAAE,QAAQ,GAAG,YAAY,CAAC;IAC9B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC,MAAM,KAAK,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IAC3E,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD,GAAG,IAAI,CAAC;AAKT,QAAA,MAAM,UAAU;;;;wBAiGkC,MAAM;;;;;CA2GvD,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -13,6 +13,13 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
|
13
13
|
import { produce } from "../../utils/immer";
|
|
14
14
|
import { useEffect, useMemo, useRef, useState } from 'react';
|
|
15
15
|
import usePersistFn from "../../common/use-persist-fn";
|
|
16
|
+
import shallowEqual from "../../utils/shallow-equal";
|
|
17
|
+
// 逐列浅比较:业务常见写法 columns.map(c => ({ ...c })) 每次都会产生新对象,但内容(含 render 引用)不变
|
|
18
|
+
var isColumnsShallowEqual = function isColumnsShallowEqual(a, b) {
|
|
19
|
+
return a.length === b.length && a.every(function (c, i) {
|
|
20
|
+
return shallowEqual(c, b[i]);
|
|
21
|
+
});
|
|
22
|
+
};
|
|
16
23
|
var getHideExpandCol = function getHideExpandCol() {
|
|
17
24
|
var cols = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
18
25
|
var expandCol = cols.find(function (col) {
|
|
@@ -48,6 +55,8 @@ var useColumns = function useColumns(props) {
|
|
|
48
55
|
var _useRef = useRef({
|
|
49
56
|
cachedColumns: null,
|
|
50
57
|
oldColumns: null,
|
|
58
|
+
oldShowCheckbox: undefined,
|
|
59
|
+
columnsSnapshot: null,
|
|
51
60
|
groupLevel: 0,
|
|
52
61
|
expandHideCol: null
|
|
53
62
|
}),
|
|
@@ -59,6 +68,11 @@ var useColumns = function useColumns(props) {
|
|
|
59
68
|
if (columnsA === context.oldColumns) {
|
|
60
69
|
return context.cachedColumns;
|
|
61
70
|
}
|
|
71
|
+
if (props.reuseEqualColumns && context.columnsSnapshot && context.cachedColumns && context.oldShowCheckbox === props.showCheckbox && isColumnsShallowEqual(columnsA, context.columnsSnapshot)) {
|
|
72
|
+
context.oldColumns = columnsA;
|
|
73
|
+
return context.cachedColumns;
|
|
74
|
+
}
|
|
75
|
+
context.oldShowCheckbox = props.showCheckbox;
|
|
62
76
|
context.expandHideCol = getHideExpandCol(columnsA);
|
|
63
77
|
var columns = columnsA.filter(function (c) {
|
|
64
78
|
return _typeof(c) === 'object';
|
|
@@ -94,6 +108,10 @@ var useColumns = function useColumns(props) {
|
|
|
94
108
|
});
|
|
95
109
|
});
|
|
96
110
|
context.oldColumns = columnsA;
|
|
111
|
+
// 与快照比较而非与旧数组比较:列对象被原地修改时旧数组里也是同一个对象,比较不出差异
|
|
112
|
+
context.columnsSnapshot = props.reuseEqualColumns ? columnsA.map(function (c) {
|
|
113
|
+
return c && _typeof(c) === 'object' ? _objectSpread({}, c) : c;
|
|
114
|
+
}) : null;
|
|
97
115
|
return context.cachedColumns;
|
|
98
116
|
});
|
|
99
117
|
var columns = getColumns(propsColumns) || [];
|