element ui select下拉框不回显

忘是亡心i 2024-04-03 12:08 115阅读 0赞

## Vue element ui 中 select 下拉框不回显： ##

项目场景：最近在使用vue element-ui 写后台时候，发现select 下拉不回显，于是发现问题，记录

--------------------

## 问题描述 ##

例如：数据传输过程中数据不时出现丢失的情况，偶尔会丢失一部分数据  
APP 中接收数据代码：

<el-form-item label="企业性质" prop="nature">
          <el-select v-model="temp.nature" placeholder="请选择" style="width: 200px;">
       			<el-option
                    v-for="item in companyNatureList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                    style="width: 200px;overflow: hidden;text-overflow: ellipsis"/>
          </el-select>
    </el-form-item>

data中初始值

companyNatureList: [{
        'label': '专业公司', 'value': '1'}, 
    	{
        'label': '基础电信企业', 'value': '2'}]

请求返回值

createDate: "2022-10-11 14:19:27"
    defaultFlag: 0
    delFlag: "0"
    id: "7cf2497cd7984f46b9e65f4360050183"
    name: "xx"
    nature: 1
    region: 110000
    type: 1

其中：nature为需要回显的值

--------------------

## 原因分析： ##

> 提示：这里填写问题的分析：

发现select下拉的id和v-model里边的id类型不一致。

--------------------

## 解决方案： ##

修改后台下拉框数据源返回类型，下拉框显示数据成功

![在这里插入图片描述][a100daee22a54be6b29edf52a1622f90.png]

[a100daee22a54be6b29edf52a1622f90.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/2223f40fb59043819ee78c6df5254404.png

发表评论取消回复

表情：

评论列表（有 0 条评论，115人围观）

还没有评论，来说两句吧...

相关阅读

相关 element ui select下拉框不回显

Vue element ui 中 select 下拉框不回显：项目场景：最近在使用vue element-ui 写后台时候，发现select 下拉不回显，于是发现问题，

忘是亡心i/ 2024年04月03日 12:08/ 0 赞/ 116 阅读

相关 vue+element-ui下拉框--下拉table

项目中有一个需求，用户点击下拉框，下拉列表为一个表格，但是element里面没有这个组件，于是组装一个，效果如下： ![在这里插入图片描述][202001061547239

淩亂°似流年/ 2023年06月27日 11:21/ 0 赞/ 20 阅读

相关 JS 实现下拉框回显

JS 实现下拉框回显学习内容：需求总结：学习内容：需求用 JS 实现下拉框回显实现代码 <!DOCTYPE

梦里梦外;/ 2022年10月16日 10:29/ 0 赞/ 284 阅读

相关 vue 下拉框回显bug

下拉框回显只能看到id 而不是对应的文字，下拉框是取字典表的数据将Value的值使用Number包裹起来，如下示例： <el-select v-model=""

Love The Way You Lie/ 2022年09月11日 11:17/ 0 赞/ 203 阅读

相关简单下拉框选项回显

<td> <label style="width:100px">是否邮件确认：</label> </td> <td> <

柔情只为你懂/ 2022年07月14日 13:15/ 0 赞/ 270 阅读

相关 jsp页面数据回显（select下拉选择框）

我的个人博客开通了，地址：[https://timewentby.com][https_timewentby.com] 欢迎访问 1。静态变量方式： <!--

深碍√TFBOYSˉ_/ 2022年07月14日 05:13/ 1 赞/ 458 阅读

相关 select下拉框数据回显

<select name="occupation"> <option value="">全部</option> <option value="

我就是我/ 2022年06月05日 23:49/ 0 赞/ 343 阅读

相关 select下拉框之数据回显解析之源码

在日常的项目开放中，select下拉框之数据回显，页面上用到这一方面的挺多。今天小弟在此奉上 jsp页面中，使用<c:if test=" 条件判断"></c:if>

比眉伴天荒/ 2022年05月13日 01:58/ 0 赞/ 243 阅读

相关 thymeleaf的下拉框(select option)回显选中

在开发一个足球联赛管理系统中，需要在修改页面使用thymeleaf模板引擎先从数据库中取出数据显示在页面中，然后再对要修改的数据分别进行修改。在input或者texta

青旅半醒/ 2022年05月11日 05:18/ 0 赞/ 1660 阅读

相关 element ui 树状结构下拉框

配置选项:此处定义el-tree的label和children为指定属性，如果不定义取默认，即label和children <template> <d

Bertha 。/ 2021年07月27日 01:05/ 0 赞/ 803 阅读