opentiny / tiny-vue

TinyVue is an enterprise-class UI component library of OpenTiny community, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.
https://opentiny.design/tiny-vue
MIT License
1.53k stars 251 forks source link

🐛 [Bug]: [tiny-select]clear-no-match-value为true且初始值为空时无法选中任何项 #1760

Open ichynul opened 1 month ago

ichynul commented 1 month ago

Version

3.16

Vue Version

3.x

Link to minimal reproduction

https://opentiny.design/vue-playground?mode=pc&theme=smb#3.16|eyJzcmMvQXBwLnZ1ZSI6IjxzY3JpcHQgbGFuZz1cInRzeFwiPlxyXG4vLyDlvJXlhaUgQG9wZW50aW55L3Z1ZSDnu4Tku7ZcclxuaW1wb3J0IHsgQnV0dG9uLCBMaW5rIH0gZnJvbSAnQG9wZW50aW55L3Z1ZSdcclxuXHJcbmV4cG9ydCBkZWZhdWx0IHtcclxuICBjb21wb25lbnRzOiB7XHJcbiAgICBUaW55QnV0dG9uOiBCdXR0b24sXHJcbiAgICBUaW55TGluazogTGlua1xyXG4gIH0sXHJcbiAgZGF0YSgpIHtcclxuICAgIHJldHVybiB7XHJcbiAgICAgIG1zZzogJ2hlbGxvIHdvcmxkISdcclxuICAgIH1cclxuICB9XHJcbn1cclxuPC9zY3JpcHQ+XHJcblxyXG48dGVtcGxhdGU+XHJcbiAgPFRpbnlCdXR0b24+56Gu5a6aPC9UaW55QnV0dG9uPlxyXG4gIDxoMT57eyBtc2cgfX08L2gxPlxyXG4gIDxkaXYgY2xhc3M9XCJ0aW55dnVlXCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwidGlueXZ1ZS1wYWdlXCI+XHJcbiAgICAgIHRpbnl2dWVcclxuICAgICAgPHRpbnktbGluayB0eXBlPVwic3VjY2Vzc1wiIGhyZWY9J2h0dHBzOi8vZ2l0aHViLmNvbS9vcGVudGlueS90aW55LXZ1ZSc+XHJcbiAgICAgICAgdGlueXZ1ZVxyXG4gICAgICA8L3RpbnktbGluaz5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG48L3RlbXBsYXRlPlxyXG5cclxuPHN0eWxlIGxhbmc9XCJsZXNzXCIgc2NvcGVkPlxyXG4gIGgxe1xyXG4gICAgY29sb3I6IzVlN2NlMDtcclxuICB9XHJcbiAgLnRpbnl2dWV7XHJcbiAgICBmb250LXNpemU6IDE4eHA7XHJcbiAgICAmLXBhZ2V7XHJcbiAgICAgIGNvbG9yOiM1ZTdjZTA7XHJcbiAgICB9XHJcbiAgfVxyXG48L3N0eWxlPlxyXG4iLCIiOiJ7XCJpbXBvcnRzXCI6e1widnVlXCI6XCJodHRwczovL3JlZ2lzdHJ5Lm5wbW1pcnJvci5jb20vdnVlLzMuNC4yNy9maWxlcy9kaXN0L3Z1ZS5ydW50aW1lLmVzbS1icm93c2VyLmpzXCIsXCJAdnVlL2NvbXBpbGVyLXNmY1wiOlwiaHR0cHM6Ly9yZWdpc3RyeS5ucG1taXJyb3IuY29tL0B2dWUvY29tcGlsZXItc2ZjLzMuNC4yNy9maWxlcy9kaXN0L2NvbXBpbGVyLXNmYy5lc20tYnJvd3Nlci5qc1wiLFwiQG9wZW50aW55L3Z1ZVwiOlwiaHR0cHM6Ly9yZWdpc3RyeS5ucG1taXJyb3IuY29tL0BvcGVudGlueS92dWUvMy4xNi9maWxlcy9ydW50aW1lL3RpbnktdnVlLm1qc1wiLFwiQG9wZW50aW55L3Z1ZS1pY29uXCI6XCJodHRwczovL3JlZ2lzdHJ5Lm5wbW1pcnJvci5jb20vQG9wZW50aW55L3Z1ZS8zLjE2L2ZpbGVzL3J1bnRpbWUvdGlueS12dWUtaWNvbi5tanNcIixcIkBvcGVudGlueS92dWUtbG9jYWxlXCI6XCJodHRwczovL3JlZ2lzdHJ5Lm5wbW1pcnJvci5jb20vQG9wZW50aW55L3Z1ZS8zLjE2L2ZpbGVzL3J1bnRpbWUvdGlueS12dWUtbG9jYWxlLm1qc1wiLFwiQG9wZW50aW55L3Z1ZS1jb21tb25cIjpcImh0dHBzOi8vcmVnaXN0cnkubnBtbWlycm9yLmNvbS9Ab3BlbnRpbnkvdnVlLzMuMTYvZmlsZXMvcnVudGltZS90aW55LXZ1ZS1jb21tb24ubWpzXCIsXCJAb3BlbnRpbnkvdnVlLXRoZW1lL1wiOlwiaHR0cHM6Ly9yZWdpc3RyeS5ucG1taXJyb3IuY29tL0BvcGVudGlueS92dWUtdGhlbWUvMy4xNi9maWxlcy9cIixcIkBvcGVudGlueS92dWUtdGhlbWUtbW9iaWxlL1wiOlwiaHR0cHM6Ly9yZWdpc3RyeS5ucG1taXJyb3IuY29tL0BvcGVudGlueS92dWUtdGhlbWUtbW9iaWxlLzMuMTYvZmlsZXMvXCIsXCJAb3BlbnRpbnkvdnVlLXJlbmRlcmxlc3MvXCI6XCJodHRwczovL3JlZ2lzdHJ5Lm5wbW1pcnJvci5jb20vQG9wZW50aW55L3Z1ZS1yZW5kZXJsZXNzLzMuMTYvZmlsZXMvXCIsXCJzb3J0YWJsZWpzXCI6XCJodHRwczovL3JlZ2lzdHJ5Lm5wbW1pcnJvci5jb20vc29ydGFibGVqcy8xLjE1LjAvZmlsZXMvbW9kdWxhci9zb3J0YWJsZS5lc20uanNcIixcIkBvcGVudGlueS92dWUtZGVzaWduLXNtYlwiOlwiaHR0cHM6Ly9yZWdpc3RyeS5ucG1taXJyb3IuY29tL0BvcGVudGlueS92dWUtZGVzaWduLXNtYi8zLjE2L2ZpbGVzL2luZGV4LmpzXCJ9fSIsInRzY29uZmlnLmpzb24iOiJ7XHJcbiAgXCJjb21waWxlck9wdGlvbnNcIjoge1xyXG4gICAgXCJhbGxvd0pzXCI6IHRydWUsXHJcbiAgICBcImNoZWNrSnNcIjogdHJ1ZSxcclxuICAgIFwianN4XCI6IFwicHJlc2VydmVcIixcclxuICAgIFwidGFyZ2V0XCI6IFwiRVNOZXh0XCIsXHJcbiAgICBcIm1vZHVsZVwiOiBcIkVTTmV4dFwiLFxyXG4gICAgXCJtb2R1bGVSZXNvbHV0aW9uXCI6IFwiQnVuZGxlclwiLFxyXG4gICAgXCJhbGxvd0ltcG9ydGluZ1RzRXh0ZW5zaW9uc1wiOiB0cnVlXHJcbiAgfSxcclxuICBcInZ1ZUNvbXBpbGVyT3B0aW9uc1wiOiB7XHJcbiAgICBcInRhcmdldFwiOiAzLjNcclxuICB9XHJcbn1cclxuIiwiY2xlYXItbm8tbWF0Y2gtdmFsdWUudnVlIjoiPHRlbXBsYXRlPlxuICA8ZGl2PlxuICAgIDxwPlxuICAgICAg5Zy65pmvMe+8muWNlemAie+8jHZhbCDmib7kuI3liLDljLnphY3lgLzvvIx2YWzkuLrvvJogLDxzcGFuIGNsYXNzPVwidmFsXCI+e3sgdmFsIH19PC9zcGFuPlxuICAgIDwvcD5cbiAgICA8dGlueS1zZWxlY3Qgdi1tb2RlbD1cInZhbFwiIDpjbGVhci1uby1tYXRjaC12YWx1ZT1cInRydWVcIj5cbiAgICAgIDx0aW55LW9wdGlvbiB2LWZvcj1cIml0ZW0gaW4gb3B0aW9uc1wiIDprZXk9XCJpdGVtLnZhbHVlXCIgOmxhYmVsPVwiaXRlbS5sYWJlbFwiIDp2YWx1ZT1cIml0ZW0udmFsdWVcIj4gPC90aW55LW9wdGlvbj5cbiAgICA8L3Rpbnktc2VsZWN0PlxuICA8L2Rpdj5cbjwvdGVtcGxhdGU+XG5cbjxzY3JpcHQ+XG5pbXBvcnQgeyBTZWxlY3QsIE9wdGlvbiB9IGZyb20gJ0BvcGVudGlueS92dWUnXG5cbmV4cG9ydCBkZWZhdWx0IHtcbiAgY29tcG9uZW50czoge1xuICAgIFRpbnlTZWxlY3Q6IFNlbGVjdCxcbiAgICBUaW55T3B0aW9uOiBPcHRpb25cbiAgfSxcbiAgZGF0YSgpIHtcbiAgICByZXR1cm4ge1xuICAgICAgb3B0aW9uczogW1xuICAgICAgICB7IHZhbHVlOiAn6YCJ6aG5MScsIGxhYmVsOiAn5YyX5LqsJyB9LFxuICAgICAgICB7IHZhbHVlOiAn6YCJ6aG5MicsIGxhYmVsOiAn5LiK5rW3JyB9LFxuICAgICAgICB7IHZhbHVlOiAn6YCJ6aG5MycsIGxhYmVsOiAn5aSp5rSlJyB9LFxuICAgICAgICB7IHZhbHVlOiAn6YCJ6aG5NCcsIGxhYmVsOiAn6YeN5bqGJyB9LFxuICAgICAgICB7IHZhbHVlOiAn6YCJ6aG5NScsIGxhYmVsOiAn5rex5ZyzJyB9XG4gICAgICBdLFxuICAgICAgdmFsOiAnJyxcbiAgICB9XG4gIH1cbn1cbjwvc2NyaXB0PlxuXG48c3R5bGUgbGFuZz1cImxlc3NcIiBzY29wZWQ+XG4udGlueS1zZWxlY3Qge1xuICB3aWR0aDogMjgwcHg7XG59XG5wIHtcbiAgZm9udC1zaXplOiAxNHB4O1xuICBsaW5lLWhlaWdodDogMS41O1xufVxuPC9zdHlsZT5cbiIsIl9vIjp7fX0=

Step to reproduce

<tiny-select v-model="val" :clear-no-match-value="true">
      <tiny-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </tiny-option>
    </tiny-select>

What is expected

clear-no-match-value应该对值为空的情况特殊处理一下

What is actually happening

No response

What is your project name

Any additional comments (optional)

No response

Issues-translate-bot commented 1 month ago

Bot detected the issue body's language is not English, translate it automatically.


Title: 🐛 [Bug]: [tiny-select]No item can be selected when clear-no-match-value is true and the initial value is empty

shenjunjian commented 1 month ago

经验证, 单选时,配置了clear-no-match-value属性后, 无法选中元素了,确认为bug。 多选时,一切功能正常。

Issues-translate-bot commented 1 month ago

Bot detected the issue body's language is not English, translate it automatically.


It has been verified that during single selection, after configuring the clear-no-match-value attribute, the element cannot be selected, which is confirmed to be a bug. When making multiple selections, everything functions normally.