feat(transfer): 代码规范

XiaoMi · Jun 26, 2024 · 5723d96 · 5723d96
1 parent d602fe2
commit 5723d96
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 29 deletions.
diff --git a/packages/ui/transfer/src/Transfer.tsx b/packages/ui/transfer/src/Transfer.tsx
@@ -8,7 +8,7 @@ import { TransferDataItem } from './types'
 import { TransferProvider } from './context'
 import { useCheck } from '@hi-ui/use-check'
 import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state'
-import { HiBaseHTMLProps, useLocaleContext } from '@hi-ui/core'
+import { HiBaseFieldNames, HiBaseHTMLProps, useLocaleContext } from '@hi-ui/core'
 import { transformData } from './utils'
 
 const _role = 'transfer'
@@ -58,10 +58,7 @@ export const Transfer = forwardRef<HTMLDivElement | null, TransferProps>(
       onChange
     )
 
-    data = useMemo(() => {
-      if(data) return transformData(data, fieldNames)
-      else return data
-    }, [data,fieldNames])
+    const transformedData = useMemo(() => transformData(data, fieldNames), [data, fieldNames])
 
     const pageSize = useMemo(() => {
       if (pagination === true) return 10
@@ -86,7 +83,10 @@ export const Transfer = forwardRef<HTMLDivElement | null, TransferProps>(
       allowCheck,
     })
 
-    const [sourceList, targetList] = useMemo(() => splitData(data, targetIds), [data, targetIds])
+    const [sourceList, targetList] = useMemo(() => splitData(transformedData, targetIds), [
+      transformedData,
+      targetIds,
+    ])
 
     const isOverflowed = useMemo(() => {
       if (targetLimit === undefined) return false
@@ -119,11 +119,11 @@ export const Transfer = forwardRef<HTMLDivElement | null, TransferProps>(
           setTargetCheckedIds([])
         }
 
-        const moveData = data.filter((item) => checkedIds.indexOf(item.id) !== -1)
+        const moveData = transformedData.filter((item) => checkedIds.indexOf(item.id) !== -1)
         tryChangeTargetIds(nextTargetIds, direction, moveData)
       },
       [
-        data,
+        transformedData,
         tryChangeTargetIds,
         setSourceCheckedIds,
         setTargetCheckedIds,
@@ -386,7 +386,7 @@ export interface TransferProps
   /**
    * 设置data中各项值对应的key
    **/
-  fieldNames?: Record<string, string>
+  fieldNames?: HiBaseFieldNames
   /**
    * 最大可穿梭上限
    */

diff --git a/packages/ui/transfer/src/utils.ts b/packages/ui/transfer/src/utils.ts
@@ -1,26 +1,27 @@
-import { TransferDataItem } from "./types";
+import { HiBaseFieldNameKeys, HiBaseFieldNames } from '@hi-ui/core'
+import { TransferDataItem } from './types'
+import React from 'react'
 
-
-export const transformData = (data: TransferDataItem[],
-  fieldNames: Record<string, string> | undefined
-  ):  TransferDataItem[] => {
-    const getKeyFields = (node: any, key: any) => {
-      if(fieldNames ){
-        return node[(fieldNames as any)[key] || key]
-      }
-      return node[key]
+export const transformData = (
+  data: TransferDataItem[],
+  fieldNames?: HiBaseFieldNames
+): TransferDataItem[] => {
+  const getKeyFields = (node: TransferDataItem, key: HiBaseFieldNameKeys) => {
+    if (fieldNames) {
+      return node[(fieldNames[key] || key) as keyof TransferDataItem]
     }
+    return node[key as keyof TransferDataItem]
+  }
 
-    const traverseNode = (node: TransferDataItem): TransferDataItem => {
-      const newNode = { ...node }
-
-      newNode.id = getKeyFields(newNode, 'id')
-      newNode.title = getKeyFields(newNode, 'title')
-      newNode.disabled = getKeyFields(newNode, 'disabled')?? false
-
-      return newNode
-    }
+  const traverseNode = (node: TransferDataItem): TransferDataItem => {
+    const newNode = { ...node }
 
-    return data.map(traverseNode) as TransferDataItem[]
+    newNode.id = getKeyFields(newNode, 'id') as React.ReactText
+    newNode.title = getKeyFields(newNode, 'title') as React.ReactNode
+    newNode.disabled = (getKeyFields(newNode, 'disabled') ?? false) as boolean
 
+    return newNode
   }
+
+  return data.map(traverseNode) as TransferDataItem[]
+}