feat(tree-select): 支持前缀后缀内容 (XiaoMi#2823)

* feat(tree-select): 支持前置后置内容(XiaoMi#2822) * chore(tree-select): 删除测试代码 * chore(tree-select): 生成变更记录文件 --------- Co-authored-by: xiamiao <[email protected]>
yang-x20 · Jun 28, 2024 · 8354ac5 · 8354ac5
1 parent fa61ff1
commit 8354ac5
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 23 deletions.
diff --git a/.changeset/many-flies-greet.md b/.changeset/many-flies-greet.md
@@ -0,0 +1,5 @@
+---
+"@hi-ui/tree-select": minor
+---
+
+feat: 新增支持前置后置内容
diff --git a/.changeset/plenty-monkeys-end.md b/.changeset/plenty-monkeys-end.md
@@ -0,0 +1,5 @@
+---
+"@hi-ui/hiui": patch
+---
+
+feat(tree-select): 新增支持前置后置内容
diff --git a/packages/ui/tree-select/src/TreeSelect.tsx b/packages/ui/tree-select/src/TreeSelect.tsx
@@ -76,6 +76,8 @@ export const TreeSelect = forwardRef<HTMLDivElement | null, TreeSelectProps>(
       height,
       size = 'md',
       customRender,
+      prefix,
+      suffix,
       ...rest
     },
     ref
@@ -245,29 +247,22 @@ export const TreeSelect = forwardRef<HTMLDivElement | null, TreeSelectProps>(
         onSearch={callAllFuncs(onSearchProp, onSearch)}
         loading={rest.loading !== undefined ? rest.loading : loading}
         trigger={
-          customRender ? (
-            typeof customRender === 'function' ? (
-              customRender(selectedItem)
-            ) : (
-              customRender
-            )
-          ) : (
-            <MockInput
-              // disabled={disabled}
-              size={size}
-              clearable={clearable}
-              placeholder={placeholder}
-              displayRender={displayRenderProp}
-              suffix={menuVisible ? <UpOutlined /> : <DownOutlined />}
-              focused={menuVisible}
-              value={value}
-              onChange={tryChangeValue}
-              data={mergedData}
-              // @ts-ignore
-              invalid={invalid}
-              appearance={appearance}
-            />
-          )
+          <MockInput
+            // disabled={disabled}
+            size={size}
+            clearable={clearable}
+            placeholder={placeholder}
+            displayRender={displayRenderProp}
+            prefix={prefix}
+            suffix={[menuVisible ? <UpOutlined /> : <DownOutlined />, suffix]}
+            focused={menuVisible}
+            value={value}
+            onChange={tryChangeValue}
+            data={mergedData}
+            // @ts-ignore
+            invalid={invalid}
+            appearance={appearance}
+          />
         }
       >
         {isArrayNonEmpty(treeProps.data) ? (
@@ -413,6 +408,14 @@ export interface TreeSelectProps
    * 自定义触发器
    */
   customRender?: React.ReactNode | ((selectedItem: TreeSelectDataItem | null) => React.ReactNode)
+  /*
+   * 选择框前置内容
+   */
+  prefix?: React.ReactNode
+  /**
+   * 选择框后置内容
+   */
+  suffix?: React.ReactNode
 }
 
 if (__DEV__) {