Element-UI ( Dropdow )下拉菜单组件command传输对象
通过 :command绑定对象数据,handleCommand方法处理数据

template
<div v-for="(item, index) in FlyWarningList" :key="index">
<div :class="[isActive === item.isRead ? '':' warning-content', 'first-content']" v-if="item.infoType === '告警信息'">
<p class='content-item infoType'>{{item.infoType}}</p>
<p class='content-item'>注册编号:{{item.content.rescueNum}}</p>
<p class='content-item'>紧急阶段:{{item.content.phase}}</p>
<p class='content-item'>降落机场:{{item.content.landingStation}}</p>
<p class='content-item'>备降机场:{{item.content.alternateAirport}}</p>
<p class='content-item'>最后联系时间:{{item.content.lastContactTime}}</p>
<p class='content-item'>最后联系位置:{{item.content.lastContactLocation}}</p>
<div class='publish-time'>发布时间:{{item.sendTime}}</div>
<el-dropdown class='content-menu' trigger="click" @command="handleCommand">
<span class="el-dropdown-link">
<i class="el-icon-arrow-down"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="item">已读</el-dropdown-item>
<el-dropdown-item command="delete">删除</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
methods
handleCommand (command) {
this.$message({
message: '消息已读',
type: 'success'
})
console.log('sendTime11111', command.sendTime)
console.log('command================2', JSON.stringify(command))
var data = {
type: command.type,
count: command.count,
active: command.active,
isRead: false,
messageNumber: command.messageNumber,
infoType: command.infoType,
infoUid: command.infoUid,
sendTime: command.sendTime,
content: command.content
}
this.$http.get('/seat/read', {
params: {
message: data
}
})
.then((res) => {
console.log('■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■')
console.log('res:', res)
console.log('■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■')
console.log(res.data)
if (res.data === '状态改变成功') {
command.isRead = false
console.log('active', command.isRead)
console.log('sendTime2222', command.sendTime)
}
}).catch((err) => {
console.log('请求失败■■■■■■■■■■■■■■' + err)
})
if (command === 'edit') {
this.$emit('toggleModal', this.activeName)
}
}
Element-UI ( Dropdow )下拉菜单组件command传输对象的更多相关文章
- JS列表的下拉菜单组件(仿美化控件select)
JS列表的下拉菜单组件(仿美化控件select) 2014-01-23 23:51 by 龙恩0707, 1101 阅读, 6 评论, 收藏, 编辑 今天是农历23 也是小年,在这祝福大家新年快乐!今 ...
- 详解Bootstrap下拉菜单组件
bootstrap框架中的下拉菜单组件是一个独立的组件,根据不同的版本,他对应的文件: less 对应的源码文件为:dropdowns.less sass对应的源码文件为:_dropdowns.scs ...
- bootstrap的下拉菜单组件与导航条
前期准备:bootstrap的css文件和js文件先引入 Bootstrap 组件-拉下菜单(class+js) 下拉菜单必需三级结构 <div class="dropdown&quo ...
- Java Swing实战(二)下拉菜单组件JComboBox及其事件监听
接下来给"数据源配置"面板添加下拉框. /** * @author: lishuai * @date: 2018/11/26 13:51 */ public class Weimi ...
- 微信小程序 - 下拉菜单组件
使用: 1.导入组件 2.使用组件 3.数据传入 4. 获取数据(通过同步缓存,获取“choose”)- 发送到后端 点击下载:小程序-下拉组件.
- Bootstrap下拉菜单
前面的话 网页交互的时候经常会需要上下文菜单或者隐藏/显示菜单项,Bootstrap默认提供了用于显示链接列表的可切换.有上下文的菜单.而且在各种交互状态下的菜单展示需要和javascript插件配合 ...
- Bootstrap3系列:下拉菜单
1.引用Bootstrap 示例引用的Bootstrap版本:v3.3.7 <script src="~/Scripts/jquery-2.2.4.min.js">&l ...
- Bootstrap框架(基础篇)之按钮,网格,导航栏,下拉菜单
一,按钮 注意:虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮. 框架中提供了基础按 ...
- Mega Dropdown - 带子分类的响应式下拉菜单
当你在开发一个内容很多的 Web 项目的时候,最具挑战性的部分之一是为了如果更方便用户浏览这些内容.我们都能想到的一个例子是 Amazon,无限的类别以及它们的子类别.Mega Dropdown 是带 ...
随机推荐
- mysql高级复习
MySQL官方对索引的定义为:索引(Index)是帮助MySQL高效获取数据的数据结构.可以得到索引的本质:索引是数据结构,可以简单理解为“排好序的快速查找数据结构”. 数据本身之外,数据库还维护着一 ...
- 简述http协议及抓包分析
1:HTTP请求头和响应头的格式 1:HTTP请求格式:<request-line><headers><blank line>[<request-body&g ...
- [LOJ#3022][网络流]「CQOI2017」老 C 的方块
题目传送门 定义有特殊边相邻的格子颜色为黑,否则为白 可以看出,题目给出的限制条件的本质是如果两个小方块所在的格子 \(x\) 和 \(y\) 为两个相邻的黑格,那么 \(x\) 和 \(y\) 之间 ...
- PairProgramming 个人第三次作业
Github地址:主仓库 https://github.com/Yanyixiao/PairProgramming.git Partner博客园地址: https://www.cnblogs.com/ ...
- Java 8 Stream流编程学习
本文是自己学习菜鸟教程中总结的笔记,用于快速找代码,完整的文档见菜鸟教程:Java 8 Stream Stream 使用一种类似用SQL语句从数据库查询数据的直观方式来提供一种对Java集合运算和表达 ...
- 关于不同python版本print不一致的简单解决方案
经常遇到python2.x的print不带括弧,但python3.x必须要带括弧,版本不一致,需要修改,但是面对数以十计的重复劳动,不免望而却步.其他的一些不一样的地方同理. 解决方案: 运用正则化替 ...
- redis--->字符串和哈希对比
redis 的字符串和哈希对比 相同点和不同点 相同点: 首先是他们有很多效果类似的命令,比如set和hset,mset和hmset等等 大多数情况下使用字符串存储的场景使用hash也可以实现. 不同 ...
- 利用http协议使用普通的网站虚拟主机+安信可A6C GPRS模块实现对stm32的远程升级
步骤: 1.生成bin文件并将bin文件放到虚拟主机目录内 2.做一个php的页面分块读取该bin文件,以asc字符echo出来,并标记好头尾长度和校验. 3.GPRS协议栈连接主机路径,收到内容,将 ...
- Java博客专栏
1. Java23种设计模式 2. JVM虚拟机 3. 设计模式6大原则 4. Java代码性能优化总结 5. 三种代理 6. iText操作PDF 7. 解析XML的4种方式 8. 面向对象思想 9 ...
- 实验20:IPv6
实验17-1: IPv6 静态路由 Ø 实验目的通过本实验可以掌握(1)启用IPv6 流量转发(2)配置IPv6 地址(3)IPv6 静态路由配置和调试(4)IPv6 默认路由配置和调试 Ø ...