element ui select 踩坑

element ui select 踩坑

今天用element ui 的select组件回显数据时无法正确匹配。

具体示例为:options为对象,对象的属性为value(number类型),属性值为label

代码如下:

<template>

<el-select v-model=”value” placeholder=”请选择”>

<el-option :label=”item” :value=”index” v-for=”(item, index) in options” :key=”index”> </el-option>

</el-select>

</template>

<script>

export default {

data() {

return {

options: { 1: 字母A, 2: 字母B }, value: ” }

}

}

</script>

由于select组件默认将传过来的value设置为String类型,因此若直接这样写,数据无法匹配。选择器显示的值会变为字符串的数字,并没有匹配到对应的属性值。(选择器对数据的显示就是若匹配到对应的value会显示相应的label;若没有匹配到,显示的是该value)。

因此若要该类数据正确显示,需要在获取到选择器应该显示的value之后,将value变为String类型。这样才可以正确显示。

转载于:https://my.oschina.net/u/2262481/blog/1920387

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/101514.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • tikv源码分析_crt脚本命令大全

    tikv源码分析_crt脚本命令大全版权声明:本文由神州数码云基地团队整理撰写,若转载请注明出处。以TiKvConfigstruct为起始点,从TiKvConfig内部的字段开始,分析每个模块的作用和配置检查逻辑所做的事情。TiKV是一个分布式事务型的键值数据库,是TiDB的存储层,提供了满足ACID约束的分布式事务接口,并且通过Raft协议保证了多副本数据一致性以及高可用。关于TiDB、TiKV的详细介绍可以从官网查阅,这里就不多赘述了。知乎上已经有一篇高屋建瓴的文章,由TiKV亲爹Ed写的TiKV代码初探,可以从整

    2022年9月23日
    5
  • mac vscode 格式化代码快捷键(vscode怎么设置快捷键)

    control+G快速找到某一行command+shift+k删除整行代码command+fn+delete删除当前行光标后的所有代码command+delete删除当前行光标前的所有代码option+fn+delete删除当前单词光标后到符号之间的代码option+delete删除当前单词光标前到符号之间的代码…

    2022年4月15日
    327
  • webstorm 快捷键 失效问题[通俗易懂]

    webstorm 快捷键 失效问题[通俗易懂] 解决方案一:file-&gt;Settings-&gt;Keymap-&gt;设置为Default解决方案二:file-&gt;Settings-&gt;IdeaVim-&gt;取消对勾重启即可。原博客地址:https://blog.csdn.net/jianyuling199/article/details/80772479…

    2022年6月23日
    55
  • 三、VHDL语言基础[通俗易懂]

    三、VHDL语言基础[通俗易懂]正文:1VHDL简介VHDL的全称为VHSIC硬件描述语言(VHSICHardwareDescriptionLanguage),VHSIC:VeryHighSpeedIntegra

    2022年7月2日
    25
  • CodeIgniter启用缓存和清除缓存的方法「建议收藏」

    CodeIgniter启用缓存和清除缓存的方法

    2022年2月8日
    45
  • 详解九章算法的作者是谁_arrayset

    详解九章算法的作者是谁_arraysetArrayDeque方法很多,而他们按过程划分分为三种,初始化,扩容,CRUD操作。下面依次来说初始化过程中依赖一个核心的函数calculateSize,它的源码如下privatestaticintcalculateSize(intnumElements){intinitialCapacity=MIN_INITIAL_CAPACITY;//Findthebestpoweroftwotoholdelements.

    2026年1月28日
    4

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号