el-select的正确用法
下拉框应该是大家非常常用的一个组件,表单几乎离不开它,可是用了三年后我突然发现我一直没有正确的使用它。。。。。
ElementUI 组件一直让我纠结的地方是 绑定的值对我来说经常需要绑定值的其他字段信息,而这个信息我一直以来都是通过code值重新find,实际上el-select 的 v-model可以直接绑定对象,通过value-key来指定关键字。
<el-select v-model="rpdComboModel" placeholder="请选择" value-key="EpCode" @change="handleSelectChange">
<el-option v-for="(item,index) in rpdComboData" :label="item.EpDesc" :value="item" :key="index"></el-option>
</el-select> // 定义数据:
rpdComboData: [
{ EpCode: 1, EpDesc: '未开始' },
{ EpCode: 2, EpDesc: '已开始' },
{ EpCode: 3, EpDesc: '已结束' }
],
rpdComboModel: { EpCode: 1, EpDesc: '未开始' } // change的处理事件
handleComboChange(val) {
console.log('handleComboChange', val)
},
el-select的正确用法的更多相关文章
- python 防止sql注入字符串拼接的正确用法
在使用pymysql模块时,在使用字符串拼接的注意事项错误用法1 sql='select * from where id="%d" and name="%s" ...
- MySQL的select for update用法
MySQL中的select for update大家应该都有所接触,但什么时候该去使用,以及有哪些需要注意的地方会有很多不清楚的地方,我把我如何使用和查询到的文档在此记录. 作用 select本身是一 ...
- Spring MVC中Session的正确用法<转>
Spring MVC是个非常优秀的框架,其优秀之处继承自Spring本身依赖注入(Dependency Injection)的强大的模块化和可配置性,其设计处处透露着易用性.可复用性与易集成性.优良的 ...
- AngularJS select中ngOptions用法详解
AngularJS select中ngOptions用法详解 一.用法 ngOption针对不同类型的数据源有不同的用法,主要体现在数组和对象上. 数组: label for value in a ...
- C#中dynamic的正确用法
C#中dynamic的正确用法 http://www.cnblogs.com/qiuweiguo/archive/2011/08/03/2125982.html dynamic是FrameWork4 ...
- C# string.Split对于换行符的分隔正确用法
C# string.Split对于换行符的分隔正确用法 tmpCase "11117144-8c91-4817-9b92-99ec2f9d784a\r\n23D95A26-012C-4332 ...
- 【转】Spring MVC中Session的正确用法之我见
Spring MVC是个非常优秀的框架,其优秀之处继承自Spring本身依赖注入(Dependency Injection)的强大的模块化和可配置性,其设计处处透露着易用性.可复用性与易集成性.优良的 ...
- 转载~kxcfzyk:Linux C语言多线程库Pthread中条件变量的的正确用法逐步详解
Linux C语言多线程库Pthread中条件变量的的正确用法逐步详解 多线程c语言linuxsemaphore条件变量 (本文的读者定位是了解Pthread常用多线程API和Pthread互斥锁 ...
- C#中dynamic的正确用法 以及 typeof(DynamicSample).GetMethod("Add");
dynamic是FrameWork4.0的新特性.dynamic的出现让C#具有了弱语言类型的特性.编译器在编译的时候不再对类型进行检查,编译期默认dynamic对象支持你想要的任何特性.比如,即使你 ...
- MySQL select into outfile用法
select into outfile用法 SELECT ... FROM TABLE_A INTO OUTFILE "/path/to/file" FIELDS TERMINAT ...
随机推荐
- git添加Github、Gitee、Gitlab秘钥
傻逼兮兮的我以为这三个的秘钥都是通用的 参考原文:https://www.cnblogs.com/zmdComeOn/p/11748991.html 首先确认已安装Git,可以通过 git –vers ...
- golang实现请求cloudflare修改域名A记录解析
现在有些DNS解析要收费,国内的几个厂商需要实名制.下面给出golang请求cloudflare修改域名A记录解析的代码. 准备工作: 在域名购买服务商处,将dns解析服务器改为cloudflare的 ...
- cadence报错because the library part is newer than the part in the design cache.Select the part in the cache and choose Design-Update Cache,and then place the part again.
cadence报错because the library part is newer than the part in the design cache.Select the part in the ...
- C# NN算法实现
NN算法的核心是,欧式距离(Euclid),在分类的数据中,找到与目标数据欧式距离最近的点,把目标点分类到其类,算法很简单,下面是C#代码的实现: namespace LocationService. ...
- 从零搭建php环境-php8-扩展-redis
一.下载1.https://pecl.php.net/get/redis-5.3.2.tgz下载到本地,文件传输上传到 /usr/local/src/2.wget -P /usr/local/src/ ...
- 织梦dede批量替换文章标题、关键词、正文内容等解决办法介绍
织梦dede批量替换文章标题.关键词.正文内容等解决办法介绍 相信对于很多织梦dedecms站长来说,应该经常遇到采集文章或者复制别人文章,需要批量修改文章标题.关键词.正文.作者.来源.日期等等相关 ...
- WebService接口实际场景应用(一)
背景:要求写一套接口测试工具.过程中遇到了WebService接口的问题,遂写下本篇文章. 阶段问题1: 需要利用数据驱动,然后读取excel中的数据并直接调用.但是webService接口与http ...
- SpringMVC-nfjh
SpringMVC springmvc项目创建 1.使用maven创建web项目结构 2.补充更改结构 3.springmvc-config.xml 1)添加包扫描(context命名空间) 2)添加 ...
- <鸳鸯刀>&<白马啸西风>随笔
这两部作品比较小众,也不如之前的作品优秀,因此简单写一下好了. <鸳鸯刀> 陕西西安府威信镖局的总镖头."铁鞭镇八方"周威信,带领一支七十多人的镖队正前往京城.路途之上 ...
- 第一课 Markdown 实操
1.Markdown (#加空格) 二级标题 (##加空格) 三级标题 (###加空格) 四级标题 (####加空格) 2.字体 Hello world 加粗(字体2边加**) Hello world ...