fix: 处理组件空对象或空数组

llq0802 · Dec 21, 2023 · 307b93a · 307b93a
1 parent 579f3d7
commit 307b93a
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 47 deletions.
diff --git a/src/CollapseCard/index.tsx b/src/CollapseCard/index.tsx
@@ -2,7 +2,7 @@ import { useControllableValue } from 'ahooks';
 import type { CollapseProps } from 'antd';
 import { Collapse } from 'antd';
 import classnames from 'classnames';
-import { emptyObject } from 'lighting-design/constants';
+import { emptyArray, emptyObject } from 'lighting-design/constants';
 import { useMemo, type CSSProperties, type FC, type ReactNode } from 'react';
 import './index.less';
 
@@ -204,7 +204,7 @@ const LCollapseCard: FC<LCollapseCardProps> = (props) => {
     <Collapse
       items={items}
       collapsible={innerCollapsible}
-      activeKey={collapsed ? [prefixCls] : []}
+      activeKey={collapsed ? [prefixCls] : emptyArray}
       ghost={ghost}
       destroyInactivePanel={destroyContent}
       bordered={bordered}

diff --git a/src/Echarts/index.tsx b/src/Echarts/index.tsx
@@ -1,10 +1,4 @@
-import {
-  useMemoizedFn,
-  useMount,
-  usePrevious,
-  useUnmount,
-  useUpdateEffect,
-} from 'ahooks';
+import { useMemoizedFn, useMount, usePrevious, useUnmount, useUpdateEffect } from 'ahooks';
 import classnames from 'classnames';
 import type { ECharts, EChartsType } from 'echarts';
 import * as echarts from 'echarts';
@@ -16,7 +10,7 @@ import {
   pick,
   transformEchartsOption,
 } from 'lighting-design/_utils';
-import { emptyObject } from 'lighting-design/constants';
+import { emptyArray, emptyObject } from 'lighting-design/constants';
 import { memo, useImperativeHandle, useRef, type FC } from 'react';
 import { bind, clear } from 'size-sensor';
 import './index.less';
@@ -26,13 +20,7 @@ export type { LEChartsInstance, LEChartsOption, LEChartsProps } from './tyeps';
 
 const prefixCls = 'lightd-echarts';
 
-const pickKeys = [
-  'option',
-  'notMerge',
-  'lazyUpdate',
-  'showLoading',
-  'loadingOption',
-];
+const pickKeys = ['option', 'notMerge', 'lazyUpdate', 'showLoading', 'loadingOption'];
 
 const LECharts: FC<LEChartsProps> = memo((props) => {
   const {
@@ -64,11 +52,7 @@ const LECharts: FC<LEChartsProps> = memo((props) => {
   /** echarts.init 初始化实例 */
   const initEchartsInstance = useMemoizedFn(async () => {
     return new Promise((resolve) => {
-      const echartsInstance = (echartsInstanceRef.current = echarts.init(
-        ref.current,
-        theme,
-        opts,
-      ));
+      const echartsInstance = (echartsInstanceRef.current = echarts.init(ref.current, theme, opts));
       resolve(echartsInstance);
     });
   });
@@ -83,7 +67,7 @@ const LECharts: FC<LEChartsProps> = memo((props) => {
     ) {
       echartOption = transformEchartsOption(
         fastDeepClone(option), // 必须先深克隆
-        [...new Set(['fontSize', ...(autoResizeFields || [])])],
+        [...new Set(['fontSize', ...(autoResizeFields || emptyArray)])],
         designWidth,
       );
     } else {
@@ -98,14 +82,8 @@ const LECharts: FC<LEChartsProps> = memo((props) => {
 
   /** 绑定图表实例事件 */
   const bindEvents = useMemoizedFn(
-    (
-      instance: ECharts,
-      events: Record<string, (params: any, ins: ECharts) => void>,
-    ) => {
-      function _bindEvent(
-        eventName: string,
-        func: (params: any, ins: ECharts) => void,
-      ) {
+    (instance: ECharts, events: Record<string, (params: any, ins: ECharts) => void>) => {
+      function _bindEvent(eventName: string, func: (params: any, ins: ECharts) => void) {
         if (isString(eventName) && isFunction(func)) {
           instance.on(eventName, (param: any) => {
             func(param, instance);
@@ -208,10 +186,7 @@ const LECharts: FC<LEChartsProps> = memo((props) => {
     }
 
     // 如果 style 或者  className 变化 重新resize
-    if (
-      !isEqual(prevProps?.style, style) ||
-      !isEqual(prevProps?.className, className)
-    ) {
+    if (!isEqual(prevProps?.style, style) || !isEqual(prevProps?.className, className)) {
       resize();
     }
   }, [
@@ -247,9 +222,7 @@ const LECharts: FC<LEChartsProps> = memo((props) => {
     };
   });
 
-  return (
-    <div ref={ref} className={classnames(prefixCls, className)} style={style} />
-  );
+  return <div ref={ref} className={classnames(prefixCls, className)} style={style} />;
 });
 
 // 第一步优化性能

diff --git a/src/TreeTable/index.tsx b/src/TreeTable/index.tsx
@@ -147,11 +147,11 @@ const LTreeTable: React.FC<LTreeTableProps> = (props) => {
   } = props;
 
   const [checkList, setCheckList] = useControllableValue<ValueType[]>({
-    defaultValue: defaultValue || [],
+    defaultValue: defaultValue || emptyArray,
     ...props,
   });
 
-  const [indeterminateList, setIndeterminateList] = useRafState<ValueType[]>([]);
+  const [indeterminateList, setIndeterminateList] = useRafState<ValueType[]>(emptyArray);
 
   const fieldNames = useCreation(
     () => ({
@@ -187,8 +187,8 @@ const LTreeTable: React.FC<LTreeTableProps> = (props) => {
   // 处理当前值的父级选中与半选中
   const processParentChecked = useMemoizedFn(
     (currentValue?: ValueType, checks?: ValueType[], indetermanites?: ValueType[]) => {
-      const newChecks = new Set(checks || []);
-      const newIndetermanites = new Set(indetermanites || []);
+      const newChecks = new Set(checks || emptyArray);
+      const newIndetermanites = new Set(indetermanites || emptyArray);
 
       // 递归处理父级勾选
       function recursion(parentVal: ValueType) {
@@ -264,7 +264,7 @@ const LTreeTable: React.FC<LTreeTableProps> = (props) => {
 
   const handleChange = useMemoizedFn((subItem: LTreeTableDataItem) => {
     const newCheckList = new Set(checkList || []);
-    const newIndetermaniteList = new Set(indeterminateList || []);
+    const newIndetermaniteList = new Set(indeterminateList || emptyArray);
 
     const currentValue = subItem[valueKey];
     const currentChecked = newCheckList.has(currentValue);
@@ -278,7 +278,7 @@ const LTreeTable: React.FC<LTreeTableProps> = (props) => {
 
     if (checkStrictly) {
       setCheckList([...newCheckList]);
-      setIndeterminateList([]);
+      setIndeterminateList(emptyArray);
       return;
     }
 
@@ -337,15 +337,15 @@ const LTreeTable: React.FC<LTreeTableProps> = (props) => {
       ? innerColumns
       : outColumns?.length
       ? outColumns.map((item) => item)
-      : [];
+      : emptyArray;
 
     return internalColumns.map((item, i) => ({
       ...item,
       title: '-',
       ...outColumns?.[i],
       onCell: (record: Record<string, any>, rowIndex: number) => {
         const col = record[item.dataIndex];
-        const outOnCell = outColumns?.[i]?.onCell?.(record, rowIndex) ?? {};
+        const outOnCell = outColumns?.[i]?.onCell?.(record, rowIndex) ?? emptyObject;
         return {
           ...outOnCell,
           rowSpan: col.rowSpan,
@@ -386,7 +386,7 @@ const LTreeTable: React.FC<LTreeTableProps> = (props) => {
       {...restProps}
       {...tableProps}
       className={classnames(prefixCls, className, tableProps?.className)}
-      dataSource={realDataSource ?? []}
+      dataSource={realDataSource ?? emptyArray}
       columns={realColumns}
     />
   );