vue+elementUI的select下拉框回显为数字问题

更新时间：2023年06月08日 14:26:10 作者：进击的Rex.

这篇文章主要介绍了vue+elementUI的select下拉框回显为数字问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教

elementUI的select下拉框回显为数字

后端传送数据给前端后，下拉框回显结果为数字！

最近遇到个问题后端返回结果后.前端双向绑定回显结果为数字.分析原因后发现是数据类型不一致导致回显异常

解决方案

把option的value转为字符类型即可

:value="dict.id+''"

解决后效果

vue下拉框回显bug

下拉框回显只能看到id 而不是对应的文字，下拉框是取字典表的数据

将Value的值使用Number包裹起来

如下示例：

<el-select  v-model="">
  <el-option v-for="item in cargoClassOption" 
             :key="item.dictValue" 
             :label="item.dictLabel"
             :value="Number(item.dictValue)">
  </el-option>
</el-select>

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

Vue微信小程序和uniapp配置环境地址
在微信小程序中，可以使用全局配置和使用开发、体验、生产环境的地址，这篇文章主要介绍了Vue微信和uniapp配置环境地址,需要的朋友可以参考下
2023-07-07
深入探讨Vue3实现多数据变化监听的方式
随着 Vue 3 的发布,框架带来了更多的新特性和增强,其中之一就是 watch 函数的升级,这一改进使得多个数据的变化侦听更加优雅和灵活,本文将深入探讨 Vue 3 中的 watch 函数,以及如何以更加优雅的方式实现对多个数据变化的监听
2023-08-08
教你用vue实现一个有趣的围绕圆弧动画效果
最近做的两个项目都是关于vue的,做完整理一下,这篇文章主要给大家介绍了关于如何用vue实现一个有趣的围绕圆弧动画效果的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
2022-04-04
在Vue中使用Echarts+封装
这篇文章主要介绍了在Vue中使用Echarts++封装,需要的朋友可以参考下
2023-11-11
手拉手教你如何处理vue项目中的错误
在项目开发中经常遇到各种报错,每次总是通过这样或那样的办法解决掉,这篇文章主要给大家介绍了关于如何处理vue项目中错误的相关资料,需要的朋友可以参考下
2022-06-06
一文详解如何在vue中实现文件预览功能
很多Vue项目中都需要PDF文件预览功能,比如合同ERP,销售CRM,内部文档CMS管理系统,内置PDF文件在线预览功能,下面这篇文章主要给大家介绍了关于如何在vue中实现文件预览功能的相关资料,需要的朋友可以参考下
2022-10-10
简单理解vue中track-by属性
这篇文章主要帮助大家简单的理解vue中track-by属性,具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2016-10-10
vue3使用iframe嵌入ureport2设计器,解决预览时NullPointerException异常问题
这篇文章主要介绍了vue3使用iframe嵌入ureport2设计器,解决预览时NullPointerException异常问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
2023-10-10
vue强制刷新组件的方法示例
这篇文章主要介绍了vue强制刷新组件的方法示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2019-02-02
Vue在css中图片路径问题解决的配置方法
这篇文章主要为大家介绍了Vue在css中图片路径问题解决，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-06-06