DevCloudFE / vue-devui

UI components based on Vue3 and DevUI Design
https://vue-devui.github.io
MIT License
1.05k stars 290 forks source link

🐛 [Bug]: select选中的选项,退格删除之后,无法再次选中该选项 #1275

Open kagol opened 2 years ago

kagol commented 2 years ago

Version

latest

Vue Version

latest

Link to minimal reproduction

复现链接: https://devui.huawei.com/vue/components/select/#筛选、搜索选项

先选择Option 1 image

再退格删除Option 1 image

这时选不到Option 1

Step to reproduce

复现链接: https://devui.huawei.com/vue/components/select/#筛选、搜索选项

先选择Option 1 image

再退格删除Option 1 image

这时选不到Option 1

What is expected

No response

What is actually happening

No response

Any additional comments (optional)

No response

Zz-ZzzZ commented 2 years ago

这个bug看了一下目前还是存在,看了一下目前Select的代码设计,input的value由两个computed依靠计算modalValue来控制,这样会缓存modalValue导致computed不会重新计算,按照目前代码设计来解决的话这样是能修复此问题,但是从代码逻辑上来讲并不是很合适

      // 在use-select.ts中的valueChange内的else分支添加此代码段
      if (props.modelValue === item.value && filter && !allowCreate) {
       // 当选择的项和上一次相同并且处于filter模式通过重置modalValue来触发computed
       // 虽然功能可以正常使用,但是正常不应该这么写
        ctx.emit('update:modelValue', '');
        nextTick(() => ctx.emit('update:modelValue', item.value));
      } else {
        ctx.emit('update:modelValue', item.value);
      }