Select: Fix tag show value or empty issue (17199) (#17396)

* Select: Fix tag show value or empty issue

* update docs

examples/docs/en-US/select.md

@@ -453,7 +453,7 @@ Enter keywords and search data from server.
     },
     mounted() {
       this.list = this.states.map(item => {
-        return { value: item, label: item };
+        return { value: `value:${item}`, label: `label:${item}` };
       });
     },
     methods: {

examples/docs/es/select.md

@@ -457,7 +457,7 @@ Introduzca palabras y datos para buscar desde el servidor.
     },
     mounted() {
       this.list = this.states.map(item => {
-        return { value: item, label: item };
+        return { value: `value:${item}`, label: `label:${item}` };
       });
     },
     methods: {

examples/docs/fr-FR/select.md

@@ -453,7 +453,7 @@ Vous pouvez aller chercher les options sur le serveur de manière dynamique.
     },
     mounted() {
       this.list = this.states.map(item => {
-        return { value: item, label: item };
+        return { value: `value:${item}`, label: `label:${item}` };
       });
     },
     methods: {

examples/docs/zh-CN/select.md

@@ -448,7 +448,7 @@
     },
     mounted() {
       this.list = this.states.map(item => {
-        return { value: item, label: item };
+        return { value: `value:${item}`, label: `label:${item}` };
       });
     },
     methods: {

packages/select/src/option.vue

@@ -153,8 +153,13 @@
     },
 
     beforeDestroy() {
+      const { selected, multiple } = this.select;
+      let selectedOptions = multiple ? selected : [selected];
       let index = this.select.cachedOptions.indexOf(this);
-      if (index > -1) {
+      let selectedIndex = selectedOptions.indexOf(this);
+
+      // if option is not selected, remove it from cache
+      if (index > -1 && selectedIndex < 0) {
         this.select.cachedOptions.splice(index, 1);
       }
       this.select.onOptionDestroy(this.select.options.indexOf(this));