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


相关推荐

  • js垃圾处理机制_java中垃圾回收有什么目的

    js垃圾处理机制_java中垃圾回收有什么目的文章目录前置知识堆栈栈堆执行上下文与作用域链执行上下文作用域链一、JavaScript中怎么被定义为垃圾使用局部变量使用对象概括二、两种回收策略标记清理引用计数概括三、什么时候执行垃圾回收关于ChromeV8引擎的GC分代回收指针与活跃对象的区分回收的执行周期四、内存问题五、Es6WeakMap参考文章前置知识堆栈栈什么是栈栈其实是一种数据结构,有着先进后出,后进先出的特性,用生活中的事物来理解最形象的就是汉诺塔了。我们在栈中存储的数据就像汉诺塔的盘子一样,最先放进去在最下面,最后放入的盘.

    2022年10月9日
    2
  • C/C++数组初始化的一些误区

    C/C++数组初始化的一些误区以前我这样初始化一个数组,并自我感觉良好:inta[5]={0};//全部初始化为0这种简单的写法让我非常爽,于是我又想把数组全部初始化为1:inta[5]={1};//我想全部初始化为1直到十分钟前,我都以为这句代码确实能够将5个元素全部初始化为1,但事实跟我想的完全不同!(基础的东西革命的本钱,疏漏不得啊)全部初始化为0的那行代码确实是没问题的,可以

    2022年7月18日
    13
  • Java设计模式简介(二):结构型模式

    Java设计模式简介(二):结构型模式

    2021年4月8日
    169
  • 怎么新建pytest的ini文件_python读取配置文件

    怎么新建pytest的ini文件_python读取配置文件前言pytest配置文件可以改变pytest的运行方式,它是一个固定的文件pytest.ini文件,读取配置信息,按指定的方式去运行查看pytest.ini的配置选项pytest-h找到以下

    2022年7月28日
    23
  • 转发和重定向的区别是什么

    转发和重定向的区别是什么1 请求次数重定向是浏览器向服务器发送一个请求并收到响应后再次向一个新地址发出请求 转发是服务器收到请求后为了完成响应跳转到一个新的地址 重定向至少请求两次 转发请求一次 2 地址栏不同重定向地址栏会发生变化 转发地址栏不会发生变化 3 是否共享数据重定向两次请求不共享数据 转发一次请求共享数据 在 request 级别使用信息共享 使用重定向必然出错 4 跳转限制重定向可以跳转到任意 URL 转发只能跳转本站点资源 5 发生行为不同重定向是客户端行为 转发是服务器端行为

    2025年10月9日
    2
  • 什么是ESLint?「建议收藏」

    什么是ESLint?「建议收藏」在我们学习ESLint之前,我们先来了解一下什么是ESLint?什么是ESLint?官网上告诉我们,ESLint是一个用来识别ECMAScript/JavaScript并且按照规则给出报告的代码检测工具,哦,所以我们可以知道,ESLint就是一个工具,而且是一个用来检查代码的工具。代码检查是一种静态的分析,常用于寻找有问题的模式或者代码,并且不依赖于具体的编码风格。对大多数编程语言…

    2022年6月18日
    34

发表回复

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

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