From eb18231a991f891fb78d73ca92fbf69c5ccef675 Mon Sep 17 00:00:00 2001
From: skytt <66660723@qq.com>
Date: Thu, 18 Aug 2022 12:01:46 +0800
Subject: [PATCH 1/4] =?UTF-8?q?feat(select):=20=E8=BF=9C=E7=A8=8B=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E5=9C=BA=E6=99=AF=E5=A2=9E=E5=8A=A0=20label=20?=
 =?UTF-8?q?=E5=9B=9E=E6=98=BE=E8=83=BD=E5=8A=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/select/demos/remote-search.vue | 18 +++++++-----
 src/select/select.tsx                   | 39 +++++++++++++++++++------
 2 files changed, 41 insertions(+), 16 deletions(-)

diff --git a/examples/select/demos/remote-search.vue b/examples/select/demos/remote-search.vue
index aec288140..c1e573ad1 100644
--- a/examples/select/demos/remote-search.vue
+++ b/examples/select/demos/remote-search.vue
@@ -1,7 +1,10 @@
 <template>
+  <!-- 远程搜索场景会改变 options 数组，导致无法检索历史选项，可通过将 valueType 改为 `object` 以从 value 中读取 `label`，解决无法回显的问题 -->
+
   <t-space>
     <t-select
       v-model="value"
+      value-type="object"
       filterable
       placeholder="请选择"
       :onSearch="remoteMethod"
@@ -11,6 +14,7 @@
     />
     <t-select
       v-model="value2"
+      value-type="object"
       multiple
       filterable
       placeholder="请输入搜索"
@@ -33,7 +37,7 @@ export default {
         { label: '选项三', value: '3' },
       ],
       options2: [],
-      value: '',
+      value: {},
       value2: [],
       loading: false,
       loading2: false,
@@ -50,15 +54,15 @@ export default {
         this.loading = false;
         this.options = [
           {
-            value: `${search}test1`,
+            value: `${search}1`,
             label: `${search}test1`,
           },
           {
-            value: `${search}test2`,
+            value: `${search}2`,
             label: `${search}test2`,
           },
           {
-            value: `${search}test3`,
+            value: `${search}3`,
             label: `${search}test3`,
           },
         ];
@@ -71,15 +75,15 @@ export default {
         this.loading2 = false;
         this.options2 = [
           {
-            value: `${search}test1`,
+            value: `${search}1`,
             label: `${search}test1`,
           },
           {
-            value: `${search}test2`,
+            value: `${search}2`,
             label: `${search}test2`,
           },
           {
-            value: `${search}test3`,
+            value: `${search}3`,
             label: `${search}test3`,
           },
         ];
diff --git a/src/select/select.tsx b/src/select/select.tsx
index b8a64a091..a847cc365 100644
--- a/src/select/select.tsx
+++ b/src/select/select.tsx
@@ -17,7 +17,7 @@ import isArray from 'lodash/isArray';
 import useDefaultValue from '../hooks/useDefaultValue';
 import { useTNodeJSX } from '../hooks/tnode';
 import { useConfig, usePrefixClass } from '../config-provider/useConfig';
-import { TdSelectProps, SelectValue } from './type';
+import { TdSelectProps, SelectValue, TdOptionProps } from './type';
 import props from './props';
 import TLoading from '../loading';
 import Popup, { PopupVisibleChangeContext } from '../popup';
@@ -90,12 +90,21 @@ export default defineComponent({
     });
     const setInnerValue: TdSelectProps['onChange'] = (newVal: SelectValue | SelectValue[], e) => {
       if (valueType.value === 'object') {
-        const { value, label } = keys.value;
+        const { value: valueOfKeys, label: labelOfKeys } = keys.value;
+
+        // 若为多选情况，将历史 value 加入 option 待取列表，兼容远程搜索改变 options 数组后旧选项无法找到的问题
+        const oldValueMap = new Map<SelectValue, TdOptionProps>();
+        if (multiple.value) {
+          (value.value as TdOptionProps[]).forEach((option) => {
+            oldValueMap.set(option[valueOfKeys], option);
+          });
+        }
+
         const getOption = (val: SelectValue) => {
-          const option = optionsMap.value.get(val);
+          const option = optionsMap.value.get(val) || oldValueMap.get(val);
           return {
-            [value]: get(option, value),
-            [label]: get(option, label),
+            [valueOfKeys]: get(option, valueOfKeys),
+            [labelOfKeys]: get(option, labelOfKeys),
           };
         };
         // eslint-disable-next-line no-param-reassign
@@ -135,14 +144,26 @@ export default defineComponent({
     );
 
     const placeholderText = computed(
-      () => ((!multiple.value && innerPopupVisible.value && getSingleContent(innerValue.value, optionsList.value))
+      () => ((!multiple.value
+          && innerPopupVisible.value
+          && ((valueType.value === 'object' && value.value[keys.value.label])
+            || getSingleContent(innerValue.value, optionsList.value)))
           || placeholder.value)
         ?? t(global.value.placeholder),
     );
 
-    const displayText = computed(() => multiple.value
-      ? getMultipleContent(innerValue.value as SelectValue[], optionsList.value)
-      : getSingleContent(innerValue.value, optionsList.value));
+    const displayText = computed(() => {
+      if (multiple.value) {
+        if (valueType.value === 'object') {
+          return (value.value as SelectValue[]).map((v) => v[keys.value.label]);
+        }
+        return getMultipleContent(innerValue.value as SelectValue[], optionsList.value);
+      }
+      if (valueType.value === 'object' && value.value[keys.value.label]) {
+        return value.value[keys.value.label];
+      }
+      return getSingleContent(innerValue.value, optionsList.value);
+    });
 
     const valueDisplayParams = computed(() => {
       const val = multiple.value

From 2ff7b898abb8a2f1a9ce4d8e6da20dd48f94e1f9 Mon Sep 17 00:00:00 2001
From: skytt <66660723@qq.com>
Date: Thu, 18 Aug 2022 13:08:45 +0800
Subject: [PATCH 2/4] fix(select): update snap file

---
 test/ssr/__snapshots__/ssr.test.js.snap | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/ssr/__snapshots__/ssr.test.js.snap b/test/ssr/__snapshots__/ssr.test.js.snap
index ca7cf8f76..5194b352e 100644
--- a/test/ssr/__snapshots__/ssr.test.js.snap
+++ b/test/ssr/__snapshots__/ssr.test.js.snap
@@ -12194,7 +12194,7 @@ exports[`ssr snapshot test renders ./examples/select/demos/remote-search.vue cor
     <div class="t-select__wrap" style="width:200px;display:inline-block;margin:0 20px 20px 0;">
       <div class="t-input__wrap t-select-input--empty t-select">
         <div class="t-input t-size-m t-is-default t-input--prefix t-input--suffix">
-          <div class="t-input__prefix"></div><input autocomplete="" placeholder="请选择" type="text" unselectable="off" value="" class="t-input__inner"><span class="t-input__suffix t-input__suffix-icon"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon"><path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path></svg></span>
+          <div class="t-input__prefix"></div><input autocomplete="" placeholder="请选择" type="text" unselectable="off" class="t-input__inner"><span class="t-input__suffix t-input__suffix-icon"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon"><path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path></svg></span>
         </div>
       </div>
     </div>

From 3bc4fa551b0fefd6168326f7cc2d5d6969c73b66 Mon Sep 17 00:00:00 2001
From: skytt <66660723@qq.com>
Date: Thu, 18 Aug 2022 13:24:16 +0800
Subject: [PATCH 3/4] =?UTF-8?q?fix(select):=20=E5=AE=8C=E5=96=84value?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E7=B1=BB=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/select/util.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/select/util.ts b/src/select/util.ts
index 3c7d8dbed..9d5b9a123 100644
--- a/src/select/util.ts
+++ b/src/select/util.ts
@@ -11,7 +11,7 @@ export const getSingleContent = (value: TdSelectProps['value'], options: SelectO
       return option?.label || String((option as TdOptionProps).value);
     }
   }
-  return value as string;
+  return value !== undefined ? String(value) : undefined;
 };
 
 export const getMultipleContent = (value: SelectValue[], options: SelectOption[]) => {

From 79261c7bfa1cdaa241601b5603318e56e6b799b5 Mon Sep 17 00:00:00 2001
From: skytt <66660723@qq.com>
Date: Mon, 22 Aug 2022 10:44:32 +0800
Subject: [PATCH 4/4] =?UTF-8?q?feat(select):=20=E8=B0=83=E6=95=B4loading?=
 =?UTF-8?q?=E6=80=81=E6=98=BE=E7=A4=BA=E4=BC=98=E5=85=88=E4=BA=8Eempty?=
 =?UTF-8?q?=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/select/select-panel.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/select/select-panel.tsx b/src/select/select-panel.tsx
index c15fa9710..3460e09fd 100644
--- a/src/select/select-panel.tsx
+++ b/src/select/select-panel.tsx
@@ -297,10 +297,10 @@ export default defineComponent({
           style={innerStyle}
         >
           {renderTNode('panelTopContent')}
-          {isEmpty && this.renderEmptyContent()}
           {isCreateOptionShown && this.renderCreateOption()}
-          {!isEmpty && loading && this.renderLoadingContent()}
-          {!isEmpty && !loading && this.renderOptionsContent(isVirtual && visibleData ? visibleData : displayOptions)}
+          {loading && this.renderLoadingContent()}
+          {!loading && isEmpty && this.renderEmptyContent()}
+          {!loading && !isEmpty && this.renderOptionsContent(isVirtual && visibleData ? visibleData : displayOptions)}
           {renderTNode('panelBottomContent')}
         </div>
       );