fix: onChange in cascader-view unable to get value (#6444)

* fix: onChange in cascader-view unable to get value

* fix: cascader update

* feat: update test

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

@@ -50,10 +50,13 @@ export const CascaderView: FC<CascaderViewProps> = p => {
   const props = mergeProps(defaultProps, p)
 
   const { locale } = useConfig()
-  const generateValueExtend = useCascaderValueExtend(props.options)
   const [labelName, valueName, childrenName, disabledName] = useFieldNames(
     props.fieldNames
   )
+  const generateValueExtend = useCascaderValueExtend(props.options, {
+    valueName,
+    childrenName,
+  })
 
   const [value, setValue] = usePropsValue({
     ...props,

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

@@ -83,7 +83,13 @@ describe('CascaderView', () => {
 
     expect(onChange).toBeCalledTimes(3)
     expect(onTabsChange).toBeCalledTimes(2)
-    expect(onChange.mock.calls[2][0]).toEqual(['浙江', '杭州', '西湖区'])
+
+    const [value, extend] = onChange.mock.calls[2]
+    const item = extend.items[0]
+
+    expect(value).toEqual(['浙江', '杭州', '西湖区'])
+    expect(item).toHaveProperty('labelT')
+    expect(item).toHaveProperty('valueT')
   })
   test('controlled mode', async () => {
     const { container } = render(

src/components/cascader-view/use-cascader-value-extend.tsx

@@ -1,25 +1,28 @@
 import { useMemo } from 'react'
 import memoize from 'lodash/memoize'
-import {
-  CascaderValue,
-  CascaderValueExtend,
-  CascaderOption,
-} from './cascader-view'
+import { CascaderValue, CascaderValueExtend } from './cascader-view'
+import type { CascaderOption } from './cascader-view'
+
+export function useCascaderValueExtend(
+  options: CascaderOption[],
+  fieldNames: CascaderOption
+) {
+  const { valueName, childrenName } = fieldNames
 
-export function useCascaderValueExtend(options: CascaderOption[]) {
   const generateItems = useMemo(() => {
     return memoize(
       (val: CascaderValue[]) => {
         const ret: CascaderOption[] = []
         let currentOptions = options
+
         for (const v of val) {
-          const target = currentOptions.find(option => option.value === v)
+          const target = currentOptions.find(option => option[valueName] === v)
           if (!target) {
             break
           }
           ret.push(target)
-          if (!target.children) break
-          currentOptions = target.children
+          if (!target[childrenName]) break
+          currentOptions = target[childrenName]
         }
 
         return ret
@@ -33,7 +36,9 @@ export function useCascaderValueExtend(options: CascaderOption[]) {
       (val: CascaderValue[]) => {
         const children = val.reduce((currentOptions, v) => {
           return (
-            currentOptions.find(option => option.value === v)?.children || []
+            currentOptions.find(option => option[valueName] === v)?.[
+              childrenName
+            ] || []
           )
         }, options)
 

src/components/cascader/cascader.tsx

@@ -17,6 +17,7 @@ import { usePropsValue } from '../../utils/use-props-value'
 import CascaderView from '../cascader-view'
 import { useConfig } from '../config-provider'
 import { useCascaderValueExtend } from '../cascader-view/use-cascader-value-extend'
+import { useFieldNames } from '../../hooks'
 import type { FieldNamesType } from '../../hooks'
 
 const classPrefix = `adm-cascader`
@@ -110,7 +111,11 @@ export const Cascader = forwardRef<CascaderRef, CascaderProps>((p, ref) => {
     },
   })
 
-  const generateValueExtend = useCascaderValueExtend(props.options)
+  const [, valueName, childrenName] = useFieldNames(props.fieldNames)
+  const generateValueExtend = useCascaderValueExtend(props.options, {
+    valueName,
+    childrenName,
+  })
 
   const [innerValue, setInnerValue] = useState<CascaderValue[]>(value)