ElementUi——el-select下拉框
<el-select v-model="ruleForm.status" placeholder="请选择状态" @change="styleChange">
<el-option v-for="item in optionA4" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
JS:
optionA4: [
{
value: '0',
label: '全部状态'
},
{
value: '1',
label: '正常运行'
},
{
value: '2',
label: '离线或故障'
},
{
value: '3',
label: '超标报警'
}
],
改变方法:
styleChange(val) {
if(val == 0){
this.isShow1 = true,
this.isShow2 = false
}else{
this.isShow1 = false
this.isShow2 = true
}
var data= {}
this.outfallType = val
data.outfallType = this.outfallType
getRealDataV2(data).then(val => {
if (val.code === 200) {
this.newData(val)
}
})
},
ElementUi——el-select下拉框的更多相关文章
- 在element-ui的select下拉框加上滚动加载
在项目中,我们需要运用到很多来自后端返回的数据.有时是上百条,有时甚至上千条.如果加上后端的多表查询或者数据量过大,这就导致在前端的显示就会及其慢,特别是在网络不好的时候更是如此. 自然,后端就做了一 ...
- vue 运用ElementUI,做select下拉框回显
第一.加载的顺序,应该先加载下拉框要选择的数据,然后在通过编辑查询数据后回显. 第二.要保证select下拉的ID和v-model里边的id保持一致. 第三.elementUI就会自动的将数据回显了. ...
- element-ui中select下拉框,选择后赋值成功,但是框上不显示的坑
这个是今天遇到一个坑,因为也是第一次使用vue+element-ui开发,所以记录一下自己遇到的一些问题. 这个问题是在开发省市区三级联动组件的时候遇到的,具体的情况如下发的gif图,虽然解决了问题, ...
- element-ui select 下拉框位置错乱--解决
element-ui select 下拉框位置错乱 由于使用 element-ui 的 select 组件时,下拉框的位置错乱了. 开始查找问题 通过各种问题查找,发现是 css 问题 css bod ...
- s:select下拉框validation验证
S:select下拉框验证: <td colspan="5"> <s:select name="vo.typeVO.corp" list=&q ...
- 自定义样式的select下拉框深入探索
第一个版本: 首先实现自定义select下拉框应该具有的功能,我是选择将原来的select隐藏掉,自己在jquery代码中动态写进去<dl><dd><dt>这样的结 ...
- jquery取消选择select下拉框
有三个select下拉框一个大类,两个小类隐藏,需要在选择大类的时候,小类显示同时清除另外的小类选择的项这需求有点儿.......... 下面是三个select: <select name=&q ...
- jquery选中将select下拉框中一项后赋值给text文本框
jquery选中将select下拉框中一项后赋值给text文本框,出现无法将第一个下拉框的value赋值给文本框 因为select默认选中第一项..在选择第一项时,便导致无法激发onchange事件. ...
- js如何获取select下拉框的value以及文本内容
select下拉框在项目开发中是经常用到的,特别是在联级菜单方面的应用更为广泛.但是,对于一些初学者来说,如何获取下拉框子节点option的value值和文本内容,还是有一点难度的.其他的就不说了,现 ...
- css配合js模拟的select下拉框
css配合js模拟的select下拉框 <!doctype html> <html> <head> <meta charset="utf-8&quo ...
随机推荐
- 微信小程序反编译~2020年
目录 摘要 介绍 安装反编译脚本 使用 获取wxapkg文件 反编译 结论 参考资料 摘要 安装wxappUnpacker小程序反编译工具并使用(2020.03) 关键词: 微信小程序反编译 wxss ...
- 视图相关SQL
前面介绍了视图的概念和作用,接下来简单的用实例SQL来展现视图. 例如:首先,创建表e_information.表e_shareholder: 然后插入表数据等,在此,这简单的部分我就省略了,直接写视 ...
- three.js 数学方法之Matrix3
今天郭先生来说一说three.js的三维矩阵,这块知识需要结合线性代数的一些知识,毕业时间有点长,线性代数的知识大部分都还给了老师.于是一起简单的复习了一下.所有的计算都是使用列优先顺序进行的.然而, ...
- docker-compose安装zabbix
在网上的很多帖子,我亲自试过,多数不行,启动后zabbix_server是退出状态,所以觉得自己亲自写一篇帖子,以作记录 1.安装docker和docker-compose yum install - ...
- A - New Building for SIS
You are looking at the floor plan of the Summer Informatics School's new building. You were tasked w ...
- java 心跳机制
心跳机制:就是每隔几分钟发送一个固定信息给服务端,服务端收到后回复一个固定信息如果服务端几分钟内没有收到客户端信息则视客户端断开. 心跳包 心跳包就是在客户端和服务器间定时通知对方自己状态的一个自己定 ...
- 如何使用Excel管理项目?
1.什么是复杂问题? 复杂问题需要很多道工序,涉及到与多个人进行沟通,人的注意力没法持续关注,导致很容易忘掉很多重要步骤.像这种问题就要用到项目管理工具,在重要的节点上,来检查自己是否遗漏了重要的环节 ...
- jmeter 命令行模式(非GUI)运行脚本,察看结果树结果为空,解决办法;
jmeter的bin目录下,打开命令窗口,执行jmeter -n -t jmeter脚本 -l 结果: 执行结束后,聚合报告打开结果,显示错误率100%:察看结果树中打开结果,显示无数据: 解决办法: ...
- PHP juliantojd() 函数
------------恢复内容开始------------ 实例 把儒略历法的日期转换为儒略日计数,然后再转换回儒略历法的日期: <?php$jd=juliantojd(6,20,2007); ...
- LeetCode刷题时引发的思考:Java中ArrayList存放的是值还是引用?
好好学习,天天向上 本文已收录至我的Github仓库DayDayUP:github.com/RobodLee/DayDayUP,欢迎Star,更多文章请前往:目录导航 前言 今天我在刷LeetCode ...