refactor: fieldName index change and tree-select use hook (#6248)

* refactor: fieldName index change and tree-select use hook

* chore: type optional

src/components/cascader-view/cascader-view.tsx

@@ -22,8 +22,8 @@ type BaseOptionType = {
   [key: string]: any
 }
 export type CascaderOption = {
-  label: string
-  value: string
+  label?: string
+  value?: string
   disabled?: boolean
   children?: CascaderOption[]
 } & BaseOptionType
@@ -54,7 +54,7 @@ export const CascaderView: FC<CascaderViewProps> = p => {
 
   const { locale } = useConfig()
   const generateValueExtend = useCascaderValueExtend(props.options)
-  const [labelName, valueName, disabledName, childrenName] = useFieldNames(
+  const [labelName, valueName, childrenName, disabledName] = useFieldNames(
     props.fieldNames
   )
 

src/components/tree-select/tree-select.tsx

@@ -5,10 +5,16 @@ import { NativeProps, withNativeProps } from '../../utils/native-props'
 import { getTreeDeep } from '../../utils/tree'
 import { mergeProps } from '../../utils/with-default-props'
 import { usePropsValue } from '../../utils/use-props-value'
+import { useFieldNames } from '../../hooks'
+import type { FieldNamesType } from '../../hooks'
 
 const classPrefix = `adm-tree-select`
 
-export interface TreeSelectOption {
+export type TreeSelectOption = {
+  label?: string
+  value?: string
+  children?: TreeSelectOption[]
+} & {
   [key: string]: any
 }
 
@@ -17,7 +23,7 @@ export type TreeSelectProps = {
   defaultValue?: string[]
   value?: string[]
   onChange?: (value: string[], extend: { options: TreeSelectOption[] }) => void
-  fieldNames?: { label: string; value: string; children: string }
+  fieldNames?: FieldNamesType
 } & NativeProps
 
 const defaultProps = {
@@ -28,10 +34,7 @@ const defaultProps = {
 
 export const TreeSelect: FC<TreeSelectProps> = p => {
   const props = mergeProps(defaultProps, p)
-  const labelName = props.fieldNames.label || 'label'
-  const valueName = props.fieldNames.value || 'value'
-  const childrenName = props.fieldNames.children || 'children'
-
+  const [labelName, valueName, childrenName] = useFieldNames(props.fieldNames)
   const [value, setValue] = usePropsValue({
     value: props.value,
     defaultValue: props.defaultValue,

src/hooks/useFieldNames.tsx

@@ -15,7 +15,7 @@ export const useFieldNames = (fieldNames: FieldNamesType = {}) => {
       children = 'children',
     } = fieldNames
 
-    return [label, value, disabled, children] as string[]
+    return [label, value, children, disabled] as string[]
   }, [JSON.stringify(fieldNames)])
 
   return fields