From 4eae674bd1b80ba0e92174c9449bc4ffda2fbc52 Mon Sep 17 00:00:00 2001
From: WmW <48251883+nullptr-z@users.noreply.github.com>
Date: Tue, 22 Mar 2022 10:49:30 +0800
Subject: [PATCH] =?UTF-8?q?fix(SearchTree):=20=E4=BF=AE=E5=A4=8D=E7=A6=81?=
 =?UTF-8?q?=E7=94=A8=E5=A4=B1=E6=95=88=E9=97=AE=E9=A2=98=20(#699)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/react-search-tree/README.md          | 36 +++++++++++++++++++
 .../react-search-tree/src/SearchTagInput.tsx  | 20 +++++++----
 .../react-search-tree/src/style/index.less    |  4 +++
 3 files changed, 54 insertions(+), 6 deletions(-)

diff --git a/packages/react-search-tree/README.md b/packages/react-search-tree/README.md
index b1621a104d..39a2c256ed 100644
--- a/packages/react-search-tree/README.md
+++ b/packages/react-search-tree/README.md
@@ -139,6 +139,42 @@ const onChangeSinge=(selectd, selectedAll,  isChecked)=>{
 ReactDOM.render(<Demo />, _mount_);
 ```
 
+### 禁用
+
+<!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->
+```jsx
+import React, { useState, useEffect, useRef } from 'react';
+import ReactDOM from 'react-dom';
+import {  SearchTree } from 'uiw';
+
+const data = [
+  { label: '上海市',  key: 0 },
+  {
+    label: '北京市',  key: 1,
+    children:[
+      { label: '东城区', key: 10 },
+   ]
+  },
+  { label: '成都市',  key: 2 },
+]
+
+const Demo = () => {
+
+  return(
+    <SearchTree
+      disabled={true}
+      style={{ width:300 }}
+      allowClear={true}
+      value={[{ label: '东城区', key: 10 },{ label: '成都市',  key: 2 }]}
+      options={data}
+      placeholder="请输入选择"
+    />
+  )
+}
+
+ReactDOM.render(<Demo />, _mount_);
+```
+
 ## 自定义空选项
 
 <!--rehype:bgWhite=true&codeSandbox=true&codePen=true-->
diff --git a/packages/react-search-tree/src/SearchTagInput.tsx b/packages/react-search-tree/src/SearchTagInput.tsx
index edc6e30f12..43375e66ed 100644
--- a/packages/react-search-tree/src/SearchTagInput.tsx
+++ b/packages/react-search-tree/src/SearchTagInput.tsx
@@ -136,6 +136,7 @@ function SearchTagInput<V extends SearchTagInputOption>(props: SearchTagInputPro
         setInnerIsOpen(isOpen);
         if (!isOpen) searchValueChange('');
       }}
+      disabled={disabled}
       isOpen={innerIsOpen}
       menu={<Card bodyStyle={emptyOption === true ? { padding: 0 } : undefined}>{newContent}</Card>}
     >
@@ -154,6 +155,7 @@ function SearchTagInput<V extends SearchTagInputOption>(props: SearchTagInputPro
                   className={`${prefixCls}-tag`}
                   key={index}
                   closable
+                  disabled={disabled}
                   color="#393E48"
                   onClose={(e) => {
                     e.stopPropagation();
@@ -166,7 +168,7 @@ function SearchTagInput<V extends SearchTagInputOption>(props: SearchTagInputPro
             })}
             <Input
               ref={inputRef}
-              style={{ flex: 1, minWidth: 30 }}
+              style={{}}
               className={`${prefixCls}-input-contents`}
               size={size}
               disabled={disabled}
@@ -176,11 +178,17 @@ function SearchTagInput<V extends SearchTagInputOption>(props: SearchTagInputPro
               placeholder={selectedOption.length ? '' : placeholder}
             />
           </div>
-          <span style={{ height: 25, width: 14 }} className={`${prefixCls}-close-tag-contents`}>
-            {(selectIconType === 'close' || (selectIconType === 'loading' && loading)) && (
-              <Icon type={selectIconType} spin={loading && selectIconType === 'loading'} onClick={resetSelectedValue} />
-            )}
-          </span>
+          {!disabled && (
+            <span style={{ height: 25, width: 14 }} className={`${prefixCls}-close-tag-contents`}>
+              {(selectIconType === 'close' || (selectIconType === 'loading' && loading)) && (
+                <Icon
+                  type={selectIconType}
+                  spin={loading && selectIconType === 'loading'}
+                  onClick={resetSelectedValue}
+                />
+              )}
+            </span>
+          )}
         </div>
       </div>
     </Dropdown>
diff --git a/packages/react-search-tree/src/style/index.less b/packages/react-search-tree/src/style/index.less
index 81e81bc2dc..ed513df04a 100644
--- a/packages/react-search-tree/src/style/index.less
+++ b/packages/react-search-tree/src/style/index.less
@@ -2,6 +2,10 @@
 
 .@{w-search-tree} {
   &-input-contents {
+    flex: 1;
+    min-width: 30px;
+    top: 1px;
+
     input {
       box-shadow: none;
       padding: 0px;