在处理el-select数据回显时遇到的问题

2023-10-30

在开发vue项目的时候,会普遍的用到elementUI组件库,当用道其中的下拉框组件时,会遇到一点儿问题。先看如下代码:

<el-select v-model='regin'>
		<el-option
		v-for="item in option"
		:key="item.value"
		:label="item.label"
		:value="item.value"
		></el-option>
</el-select>

data(){
		return{
				option:[
						{
								value:'1',
								label:'选项1'
						},
						{
								value:'2',
								label:'选项2'
						},
						{
								value:'3',
								label:'选项3'
						},
				],
				regin:''
		}
}

而v-model绑定的regin值实际上时选中选项的id值。
那么在处理数据会显得时候,往往要根据后台返回的id值来默认选中某选项。代码如下:

this.regin = res.data.condition
//condition 后台返回数据 值为数值1
//conditionName 选项1

这样写的后果是select会直接回显一个1
如果想要select显示“选项1”,

this.regin = String(res.data.condition)

就要这样写才可以;
原因是你赋给this.regin的值的类型要与rejin绑定的值的类型一样,才会回显成功。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在处理el-select数据回显时遇到的问题 的相关文章

随机推荐

  • javaweb jsp的认识

    1 java 程序片 1 在jsp中 之间的书写叫做java 程序片 一个jsp中页面中可以有多个java 程序片 在java 程序片声明的变量 在它们所在的jsp中的所有java 程序片及表达式中都有效 java 程序片中声明的变量 只在
  • 测试用例设计白皮书--判定表驱动分析方法

    测试用例设计白皮书 判定表驱动分析方法 Author Vince 来源 http blog csdn net vincetest 一 方法简介 1 定义 判定表是分析和表达多逻辑条件下执行不同操作的情况的工具 2 判定表的优点 能够将复杂的
  • 基于Java的飞机大战游戏的设计与实现论文

    源码下载 http www byamd xyz hui zong 1 摘 要 现如今 随着智能手机的兴起与普及 加上4G the 4th Generation mobile communication 第四代移动通信技术 网络的深入 越来越
  • 【华为OD机试真题 python】任务总执行时长【2022 Q4

    题目描述 任务总执行时长 任务编排服务负责对任务进行组合调度 参与编排的任务有两种类型 其中一种执行时长为taskA 另一种执行时长为taskB 任务一旦开始执行不能被打断 且任务可连续执行 服务每次可以编排num个任务 请编写一个方法 生
  • idea 没有java文件夹_IntelliJ IDEA右键文件夹没有Java Class文件的原因及解决方法

    问题 在项目里创建文件夹后 发现竟然不能新建class文件 问题详细如下图 原因分析 这里涉及到Sources的作用 Sources 一般用于标注类似 src 这种可编译目录 有时候我们项目当中 可能不单单是 src 目录为可编译的 很可能
  • 讨论scrapy-splash渲染不成功问题?

    url https wenshu court gov cn website wenshu 181107ANFZ0BXSK4 index html docId 75461a02d9714cec9322ab4500147439 由于scrapy
  • java基础类型知识

    原生类 基本数据类型 和强类型 引用类型 1 除了八个基本数据类型都是引用类型 但是八个基本数据类型可转换为包装类 基本数据类型没有方法 强类型有方法 装箱 基本数据类型转换为包装类 拆箱 包装类转换为基本数据类型 byte Byte sh
  • element-ui菜单栏切换页面高亮刷新后不显示问题

    最近做的一个vue的小项目 在点击菜单栏其他页面之后高亮会跟着过去 但是刷新后高亮又会重新跳到最初进入的页面 原因是这样的 element ui官网示例 default active activeIndex 这个控制高亮 然后在data中一
  • qt 比较两个字符串是否相等

    QString str QString fromLocal8Bit 球形 if str compare QString fromLocal8Bit 球形 0 或者 if str QString fromLocal8Bit 球形
  • GMAC接口(4)——编程指南

    Note 基于DWC ether qos控制器 RTL8211F PHY 1 硬件复位PHY 可选 通过GPIO接口 将复位信号 持续至少10ms的低电平脉冲 发送到PHY 2 初始化控制器 a 软复位 软件复位 gmac DMA Mode
  • Emacs 之查看帮助

    Emacs 之查看帮助 Table of Contents 1 Emacs 入门 1 1 查看简单的帮助 1 2 执行elisp代码 1 Emacs 入门 1 1 查看简单的帮助 C h f 查看函数的文档 describe functio
  • [人工智能-深度学习-81]:视觉 - 视频换脸软件大全

    作者主页 文火冰糖的硅基工坊 文火冰糖 王文兵 的博客 文火冰糖的硅基工坊 CSDN博客 本文网址 https blog csdn net HiWangWenBing article details 122504846 目录 第1名 ZAO
  • 腾讯云轻量2核4G5M服务器_CPU内存_流量_带宽_系统盘

    腾讯云轻量2核4G5M服务器 CPU内存流量带宽系统盘性能测评 轻量应用服务器2核4G5M带宽 免费500GB月流量 60GB系统盘SSD盘 5M带宽下载速度可达640KB 秒 流量超额按照0 8元每GB支付流量费 轻量2核4G5M服务器一
  • 华为ensp配置实验大全(免费&持续更新)

    点开一篇文章 分享 要收费 点开一篇文章 大全 但就两个实验 点开一篇文章 详细 但全截图 我忽略了最重要的东西 产品说明书 产品说明书优势 规范 详细 此文寻找官方手册中的配置实验 博客好文 基础实验为主 你知道的答案 不是下一次作业的答
  • OV7670循迹算法整理

    资源在这 http download csdn net download hello world12138 9910603 2016 7 3 1 今天发现一个比较尴尬的问题 之前摄像头采集到的图像和现实中我显示的图像的旋转方向根本就是反的
  • vivado路径最大时钟约束_【Vivado使用误区与进阶】XDC约束技巧之时钟篇

    Xilinx 的新一代设计套件Vivado中引入了全新的约束文件XDC 在很多规则和技巧上都跟上一代产品ISE中支持的UCF大不相同 给使用者带来许多额外挑战 Xilinx工具专家告诉你 其实用好XDC很容易 只需掌握几点核心技巧 并且时刻
  • Springboot 配置动态多数据源(Mybatis-plus)

    前言 在项目中需要用到动态切换多数据源 查阅Mybatis plus文档得知可以通过 DS注解 但该方法主要针对不同内容的数据源 而目前场景是相同内容的数据库需要在运行时根据请求头动态切换 因此文档方法不适用 注意 不要使用dynamic
  • C语言,使用指针封装函数,实现字符串拷贝,void MyStrcpy(char *p,char *q)

    使用指针实现字符串拷贝 include
  • Docker进阶学习:Raft一致性协议

    双主双从 假设一个结点挂了 其他结点是否可以用 我们接着上面的集群可以做实验 就是我挂掉一个主机的docker服务 看这个swarm可不可以 启动docker服务 sudo systemctl start docker 停止docker服务
  • 在处理el-select数据回显时遇到的问题

    在开发vue项目的时候 会普遍的用到elementUI组件库 当用道其中的下拉框组件时 会遇到一点儿问题 先看如下代码