关于Vue Element组件el-checkbox与el-select默认选中值的几点注意事项
el-select
示例:

代码:
<el-select v-model="doc.zhic" placeholder="请选择">
<el-option
v-for="(item,index) in zhicdata"
:key="index"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
doc: {
zhic: ""
},
zhicdata: [
{
name: "主任医师",
id: "11"
},
{
name: "副主任医师",
id: "12"
},
{
name: "主治医师",
id: "13"
},
{
name: "住院医师",
id: "14"
}
],
// 获取职称
stepDoc(index){
this.idx=index;
const item = this.hislist[index];
this.doc={
zhic:item.zhic.toString() //获取到的是数字,一定要转换为字符串
},
},
v-model中的值就是默认选中的值,一定要注意这里的:value的类型一定要跟v-model类型一样。值为空时,默认值为空值。
el-checkbox
示例:
代码:
<el-checkbox-group v-model="doc.doctime">
<el-checkbox
v-for="item in doctimeData"
:label="item.id"
true-label
:key="item.id"
@change="changeDoctime(item.value)"
>{{item.title}}</el-checkbox>
更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/119250980
关于Vue Element组件el-checkbox与el-select默认选中值的几点注意事项的更多相关文章
- 自定义Vue&Element组件,实现用户选择和显示
在我们很多前端业务开发中,往往为了方便,都需要自定义一些用户组件,一个是减少单一页面的代码,提高维护效率:二个也是方便重用.本篇随笔介绍在任务管理操作中,使用自定义Vue&Element组件, ...
- jquery 获取和设置 checkbox radio 和 select option的值?
============== 获取和设置 checkbox radio 和 select的值? === val()函数, 其名字就表达了 它的意思: 他就是= value 的简写! val就是valu ...
- jquery设置checkbox状态,设置dropdownlist选中值,隐藏某控件,给某控件追加东西
jquery设置checkbox状态 $("[ID$=chkType]").attr("checked", true); jquery设置dropdownlis ...
- freemarker中修改和添加功能中包含checkbox复选框默认选中需求的解决方式
今天做的公司ERP系统上线第一天内部使用的,各种BUG铺天盖地,[虽然只是技术总监一个人在测试……],其中有一个就是其中部门管理页面中的修改和添加功能 一个人做一套ERP总是有点疏漏的,虽然里面的东西 ...
- 使用vxe table组件时,edit-render配置$select',选中option后关闭cell的激活状态,显示选中option的value问题
在我的项目中使用vxe table组件时,edit-render配置{name: '$select', options: [{label:"脉搏",value:"maib ...
- iview组件DatePicker type="datetimerange绑定初始默认时间值
使用::value="[this.startTime,this.endTime]",绑定当天时间 如下: <DatePicker type="datetimeran ...
- Vue select默认选中第一个
<td> <select v-model="selectWare"> <option selected="selected" va ...
- vue+element ui中select组件选择失效问题原因与解决方法
codejing 2020-07-10 09:13:31 652 收藏 分类专栏: Web Vue Element UI 版权 .当表单form赋完值后,如果后续又对form中某一属性值进行操作如 ...
- vue中select设置默认选中
vue中select设置默认选中 一.总结 一句话总结: 通过v-model来:select上v-model的值为option默认选中的那项的值(value) 二.select设置默认选中实例 < ...
随机推荐
- MySQL5.6复制技术
mysql复制功能介绍 我们可以通过为服务器配置主从即一个或多个备库的方式,以及主主结构来进行数据同步,将MySQL的数据分布到多个系统上去.复制过程中一台主库(master)服务器可以数据被同步到多 ...
- 自家APP打开微信小程序,可行吗?
小程序的通用解决方案,今天为大家介绍一下FinClip.它的最大特点,就是能够让任何 App 运行小程序. 只需要在你的 App 里面,引入它的 SDK,就能加载运行外部小程序了.除了 SDK,它还提 ...
- Fastjsonfan反序列链学习前置知识
Fastjson前置知识 Fastjson 是一个 Java 库,可以将 Java 对象转换为 JSON 格式,当然它也可以将 JSON 字符串转换为 Java 对象. Fastjson 可以操作任何 ...
- 解决windows下WslRegisterDistribution failed with error: 0x80070050的问题
最近升级了老电脑的windows10的系统,发现wsl2里面安装的ubuntu20.04不能在windows terminal正常启动了(我之前是把ubuntu20.04作为默认启动终端的.) 涉及报 ...
- 前端优化建议:合理利用JavaScript的条件运算符
在最近的项目中要使用到一个格式化文件大小的算法,于是不假思索写了如下代码: function formatSize(size){ if(size<1024){ return size+" ...
- 2003031121-浦娟-python数据分析第三周作业-第一次作业
项目 内容 课程班级博客链接 https://edu.cnblogs.com/campus/pexy/20sj 作业链接 https://edu.cnblogs.com/campus/pexy/20s ...
- TCP 协议灵魂 12 问,巩固你的网路底层基础!
点击上方"开源Linux",选择"设为星标" 回复"学习"获取独家整理的学习资料! 先亮出这篇文章的思维导图 TCP 作为传输层的协议,是一 ...
- js项目案例
2021.04.12 --mouseover抖动情况之一
- line-height和height关系
如图所示,line-height = font-size + 上下本行距.上下半行距总是相等.font-size居于中间.当font-size值固定时,line-height越大,半行距越大.所以当l ...
- C#/VB.NET 创建图片超链接
超链接(Hyperlink)可以看做是一个"热点",它可以从当前Web页定义的位置跳转到其他位置,包括当前页的某个位置.Internet.本地硬盘或局域网上的其他文件,甚至跳转到声 ...