fix(components): [TreeSelect] incorrect label when data modify

packages/components/tree-select/src/tree-select-option.ts

@@ -1,4 +1,4 @@
-import { defineComponent } from 'vue'
+import { defineComponent, getCurrentInstance, nextTick } from 'vue'
 import { ElOption } from '@element-plus/components/select'
 
 const component = defineComponent({
@@ -9,6 +9,23 @@ const component = defineComponent({
     // use methods.selectOptionClick
     delete result.selectOptionClick
 
+    const vm = (getCurrentInstance() as NonNullable<any>).proxy
+
+    // Fix: https://github.com/element-plus/element-plus/issues/7917
+    // `el-option` will delete the cache before unmount,
+    // This is normal for flat arrays `<el-select><el-option v-for="3"></el-select>`,
+    // Because the same node key does not create a difference node,
+    // But in tree data, the same key at different levels will create diff nodes,
+    // So the destruction of `el-option` in `nextTick` will be slower than
+    // the creation of new `el-option`, which will delete the new node,
+    // here restore the deleted node.
+    // @link https://github.com/element-plus/element-plus/blob/6df6e49db07b38d6cc3b5e9a960782bd30879c11/packages/components/select/src/option.vue#L78
+    nextTick(() => {
+      if (!result.select.cachedOptions.get(vm.value)) {
+        result.select.onOptionCreate(vm)
+      }
+    })
+
     return result
   },
   methods: {