fix(list): list mode=cascader onChange return value and options (#1779)

src/list-picker/interfance.ts

@@ -5,7 +5,7 @@ import { OptionProps } from '../list/interfance';
 import { Placement, TriggerAction } from '../popover/interface';
 import { ListProps } from '../list';
 
-export interface ListPickerProps extends Pick<ListProps, 'model' | 'empty' | 'needEmpty' | 'max'> {
+export interface ListPickerProps extends Pick<ListProps, 'model' | 'empty' | 'needEmpty' | 'max' | 'valueSeparator'> {
   size?: 'small' | 'normal';
   /**
    * 触发方式
@@ -67,10 +67,6 @@ export interface ListPickerProps extends Pick<ListProps, 'model' | 'empty' | 'ne
    * cascader 级联文本连接符
    */
   separator?: string;
-  /**
-   * value解析连接符 默认为 '.'
-   */
-  valueSeparator?: string;
   /**
    * 是否允许clear
    */

src/list-picker/listPicker.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
 import { isEqual, isNil } from 'lodash';
-import { useLocale , usePrefixCls } from '@gio-design/utils';
+import { useLocale, usePrefixCls } from '@gio-design/utils';
 import { ListPickerProps } from './interfance';
 import Popover from '../popover';
 import Trigger from './Trigger';
@@ -61,7 +61,8 @@ export const ListPicker: React.FC<ListPickerProps> = (props) => {
   const defaultPrefix = usePrefixCls(prefixCls);
   const [visible, setVisible] = useControlledState(controlledVisible, false);
   const [value, setValue] = useState(controlledValue || defaultValue);
-  const { options, setOptions, getOptionByValue, getLabelByValue, getOptionsByValue } = useCacheOptions();
+  const { options, setOptions, getOptionByValue, getLabelByValue, getOptionTreeByValue, getOptionsByValue } =
+    useCacheOptions();
   const triggerRef = useRef<HTMLInputElement | undefined>(undefined);
   useEffect(() => {
     setValue(controlledValue);
@@ -172,6 +173,7 @@ export const ListPicker: React.FC<ListPickerProps> = (props) => {
         getOptionByValue,
         getOptionsByValue,
         getLabelByValue,
+        getOptionTreeByValue,
         emptyNode: empty,
         isEmpty: needEmpty,
         recentId: propsRecentId,

src/list/List.tsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 import { isArray, isEmpty } from 'lodash';
-import { useLocale , usePrefixCls } from '@gio-design/utils';
+import { useLocale, usePrefixCls } from '@gio-design/utils';
 import { OptionProps, ListProps } from './interfance';
 import { PREFIX } from './constants';
 import Item from './Item';
@@ -36,6 +36,7 @@ export const InnerList = WithRef<HTMLDivElement, ListProps>((props, ref?) => {
     empty,
     max,
     needEmpty = false,
+    valueSeparator,
     ...listRestProps
   } = props;
 
@@ -52,6 +53,7 @@ export const InnerList = WithRef<HTMLDivElement, ListProps>((props, ref?) => {
     disabled: contextDisabled,
     onChange: contextOnChange,
     setOptions: contextSetOptions,
+    getOptionTreeByValue: contextGetOptionTreeByValue,
     isSelection,
   } = context;
   const mergedModel = useMemo(() => model ?? contextModel, [contextModel, model]);
@@ -108,7 +110,11 @@ export const InnerList = WithRef<HTMLDivElement, ListProps>((props, ref?) => {
     }
     // cascader
     else if (mergedModel === 'cascader') {
-      onChange?.(val);
+      onChange?.(
+        val,
+        contextGetOptionTreeByValue?.(val, valueSeparator, mergedModel) ??
+          cache?.getOptionTreeByValue(val, valueSeparator, mergedModel)
+      );
     }
     // normal
     else if (value !== val) {
@@ -185,6 +191,10 @@ export const InnerList = WithRef<HTMLDivElement, ListProps>((props, ref?) => {
         emptyNode: mergedEmpty,
         value,
         disabled: mergedDisabled,
+        getLabelByValue: context.getLabelByValue ?? cache.getLabelByValue,
+        getOptionTreeByValue: context.getOptionTreeByValue ?? cache.getOptionTreeByValue,
+        getOptionByValue: context.getOptionByValue ?? cache.getOptionByValue,
+        getOptionsByValue: context.getOptionsByValue ?? cache.getOptionsByValue,
         prefix,
         suffix,
         onChange,

src/list/context.tsx

@@ -28,6 +28,7 @@ export interface ListContextProps {
     valueSeparator?: string,
     model?: ModelType
   ) => any;
+  getOptionTreeByValue?: (val?: string | number, valueSeparator?: string, model?: string) => any;
 }
 const defaultList: ListContextProps = {
   value: '',
@@ -46,6 +47,7 @@ const defaultList: ListContextProps = {
   getOptionByValue: undefined,
   getOptionsByValue: undefined,
   getLabelByValue: undefined,
+  getOptionTreeByValue: undefined,
 };
 export const ListContext = React.createContext<ListContextProps>(defaultList);
 

src/list/interfance.ts

@@ -76,6 +76,10 @@ export interface ListProps {
   itemStrategy?: 'fixed' | 'absolute';
   empty?: React.ReactNode;
   needEmpty?: boolean;
+  /**
+   * value解析连接符 默认为'.'
+   */
+  valueSeparator?: string;
 }
 
 export interface DragListProps extends Omit<ListProps, 'model' | 'onChange' | 'value' | 'children'> {