feat(field): add preserveOriginalLabel prop to SearchSelect

- Add preserveOriginalLabel prop to control whether to use the original label when option is selected - Fix the issue where highlighted search text appears in the input box when option is selected BREAKING CHANGE: None
ant-design · Dec 11, 2024 · ef1971b · ef1971b
1 parent 21ce755
commit ef1971b
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 2 deletions.
diff --git a/packages/field/src/components/Select/SearchSelect/index.tsx b/packages/field/src/components/Select/SearchSelect/index.tsx
@@ -89,6 +89,13 @@ export interface SearchSelectProps<T = Record<string, any>>
 
   /** 默认搜索关键词 */
   defaultSearchValue?: string;
+
+  /**
+   * 在选择时保留选项的原始标签文本
+   * 当设置为 true 时，选中后回填的内容将使用选项的原始 label，而不是经过 optionItemRender 处理后的内容
+   * @default false
+   */
+  preserveOriginalLabel?: boolean;
 }
 
 const SearchSelect = <T,>(props: SearchSelectProps<T[]>, ref: any) => {
@@ -115,6 +122,7 @@ const SearchSelect = <T,>(props: SearchSelectProps<T[]>, ref: any) => {
     showSearch,
     fieldNames,
     defaultSearchValue,
+    preserveOriginalLabel = false,
     ...restProps
   } = props;
 
@@ -163,6 +171,7 @@ const SearchSelect = <T,>(props: SearchSelectProps<T[]>, ref: any) => {
         return {
           ...dataItem,
           ...item,
+          label: preserveOriginalLabel ? dataItem.label : item.label,
         };
       });
     }
@@ -284,9 +293,23 @@ const SearchSelect = <T,>(props: SearchSelectProps<T[]>, ref: any) => {
           const dataItem = optionList && optionList['data-item'];
           // 如果value值为空则是清空时产生的回调,直接传值就可以了
           if (!value || !dataItem) {
-            onChange?.(value, optionList, ...rest);
+            const changedValue = value
+              ? {
+                  ...value,
+                  label: preserveOriginalLabel ? dataItem?.label : value.label,
+                }
+              : value;
+            onChange?.(changedValue, optionList, ...rest);
           } else {
-            onChange?.({ ...value, ...dataItem }, optionList, ...rest);
+            onChange?.(
+              {
+                ...value,
+                ...dataItem,
+                label: preserveOriginalLabel ? dataItem.label : value.label,
+              },
+              optionList,
+              ...rest,
+            );
           }
           return;
         }

diff --git a/packages/field/src/components/Select/index.tsx b/packages/field/src/components/Select/index.tsx
@@ -528,6 +528,7 @@ const FieldSelect: ProFieldFC<
             fetchData(keyWord);
           }}
           resetData={resetData}
+          preserveOriginalLabel
           optionItemRender={(item) => {
             if (typeof item.label === 'string' && keyWordsRef.current) {
               return (