vue表单数据回显有问题

解决Vue中a-select下拉列表数据不回显问题

最新推荐文章于 2024-07-11 19:26:27 发布

原创最新推荐文章于 2024-07-11 19:26:27 发布 · 2.6k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

开发学习笔记专栏收录该内容

8 篇文章

订阅专栏

本文记录了一个Vue应用中遇到的表单组件<a-select>数据不回显的bug，问题根源在于value类型的不匹配。通过typeof检查发现<a-select>的value与<a-select-option>的value数据类型不同，通过类型转换解决了这个问题。

简单记一下

今天遇到表单中的“a-select”的下拉列表数据不回显的问题，通过typeof查看后发现是<a-select>中的value和<a-select-option>的value，数据类型不同造成的。类型转换即可解决问题。

<a-select
    ref="select"
    v-model:value="category.parent"
>
   <a-select-option :value="0">无</a-select-option>
   <a-select-option v-for="c in level" :value="Number(c.id)" :key="Number(c.id)">
       {{c.name}}
   </a-select-option>
</a-select>