关于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设置默认选中实例 < ...
随机推荐
- 1903021116—吉琛—Java第七周作业—客户类测试
项目 内容 课程班级博客链接 19信计班 这个作业要求链接 第七周作业链接 博客名称 学号-姓名-Java第七周作业-客户类测试 要求 每道题要有题目,代码(使用插入代码,不会插入代码的自己查资料解决 ...
- AWS-Basic-S3
Amazon Simple Storage Service,简称 S3 服务,是 AWS 2006 年推出的第一个服务,用于提供对象存储服务.其在可拓展性,数据可用性,安全性和性能都有着非常不错的体验 ...
- 读完学会shell语法,shell脚本80%已经学会
第3章 shell语法讲解 3.1 shell运算讲解 3.1.1 运算符的讲解 3.1.2 shell运算方式的讲解 3.1.2.1 $(())运算 [root@m01 test_init] # a ...
- BootstrapBlazor实战 Menu 导航菜单使用(1)
实战BootstrapBlazorMenu 导航菜单的使用, 以及整合Freesql orm快速制作菜单项数据库后台维护页面 demo演示的是Sqlite驱动,FreeSql支持多种数据库,MySql ...
- Idea使用入门
jeecgboot推荐使用的idea是2019,原使用的2017在自动识别maven项目上有点问题,甚至2019在一些报错下仍然可以直接运行项目 idea的安装结构(卸载细节涉及) 下载文件位 ...
- .NET混合开发解决方案9 WebView2控件的导航事件
系列目录 [已更新最新开发文章,点击查看详细] WebView2控件应用详解系列博客 .NET桌面程序集成Web网页开发的十种解决方案 .NET混合开发解决方案1 WebView2简介 .NE ...
- Wireshark抓包分析TCP“三次握手,四次挥手”
1.目的 客户端与服务器之间建立TCP/IP连接,我们知道是通过三次握手,四次挥手实现的,但是很多地方对这个知识的描述仅限于理论层面,这次我们通过网络抓包的方式来看一下实际的TCP/IP传输过程. 2 ...
- ElasticSearch7.3学习(二十五)----Doc value、query phase、fetch phase解析
1.Doc value 搜索的时候,要依靠倒排索引: 排序的时候,需要依靠正排索引,看到每个document的每个field,然后进行排序. 所谓的正排索引,其实就是doc values. 在建立索引 ...
- 219. Contains Duplicate II - LeetCode
Question 219. Contains Duplicate II Solution 题目大意:数组中两个相同元素的坐标之差小于给定的k,返回true,否则返回false 思路:用一个map记录每 ...
- 用 notion 管理信用卡与花呗
用 notion 管理信用卡与花呗 Notion原文,排版更佳 概述 不需要提醒功能和安卓用户可以忽略Scriptable和快捷指令 app的设置 Notion 建立信用卡表格,录入信用卡基本信息,自 ...