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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • CODEIF_变量取名「建议收藏」

    CODEIF_变量取名「建议收藏」网址https://unbug.github.io/codelf/大部分开发者都或多或少遇到过变量命名的烦恼,如果命名不规范,不仅会影响开发的效率,而且对后面维护的同学来说也是一个不小的挑战,因为他要去揣摩你这个变量的含义。“计算机科学里两件最难的事:缓存失效和命名。”Codelf通过搜索在线开源平台Github,Bitbucket,GoogleCode,Codeplex,Sou…

    2022年4月19日
    437
  • Javascript数组排序sort方法和自定义排序方法

    Javascript数组排序sort方法和自定义排序方法前言针对一个数组进行排序,一个很常见的需求.尤其在后端.当然,前端也是有这个需求的.当然,数组排序,是有现成的方法的.就是sort()方法.我们先开看下这个.标准答案,sort方法vararr=[45,98,67,57,85,6,58,83,48,18];console.log(‘原数组’);console.log(arr);console.log(‘sort方…

    2022年6月7日
    45
  • BIEE-1 初始化块和变量[通俗易懂]

    BIEE-1 初始化块和变量[通俗易懂]一、初始化块biee初始化块分为资料库、会话两类资料库初始化块:可批量同事定义变量的值配置:1.“编辑数据源”写入sql并分配地址池;2.“编辑数据目标”配置变量,变量的值和初始化sql结果是按顺序匹配的,一对一关系;3.“刷新时间间隔”默认是1小时,即每个一小时系统就会自动执行一遍此初始化块语句,并把结果存在缓冲池中,用户登录系统时,从缓冲池中

    2025年5月24日
    2
  • HT for Web嵌入QtWebKit的客户端解决方案

    HT for Web嵌入QtWebKit的客户端解决方案

    2021年9月2日
    70
  • 数电设计–交通灯控制系统「建议收藏」

    数电设计–交通灯控制系统「建议收藏」一、课程设计的内容题目:交通灯控制系统交通灯控制系统时典型的数字电路系统,通过该系统的设计、仿真、制板、答辩和报告等环节,同学可得到数字电路及系统的综合训练。本课程要求设计一个十字路口的交通灯控制器,控制A、B两条交叉道路上的车辆通行。具体要求如下:(1)在十字路口,主、支干道分别设置一组信号灯,每组信号灯由红、黄、绿等表示允许通行,红灯表示禁止通行,黄灯表示该车道上已过停车线的车辆继续通信,未过停车线的车辆停止通行。(2)主、支干道交替通行,主干道每次放行30s,支干道每次放行20s。(3)每

    2022年9月24日
    2

发表回复

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

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