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累加、累减
累加 先上表结构: CREATE TABLE `abc` ( `jidu` ) NOT NULL AUTO_INCREMENT, `jine` ) DEFAULT NULL, PRIMARY KEY ...
- 关于爬虫的日常复习(7)—— DOM操作及selenium库
- Activiti邮件任务
Activiti邮件任务 作者:Jesai 会不会有那么一天,你会妒忌 Activiti有一种任务叫做邮件任务,顾名思义,就是流程办理到邮件任务的时候,系统就会自动的给你发送任务. Activiti所 ...
- HBase二次开发之搭建HBase调试环境,如何远程debug HBase源代码
版本 HDP:3.0.1.0 HBase:2.0.0 一.前言 之前的文章也提到过,最近工作中需要对HBase进行二次开发(参照HBase的AES加密方法,为HBase增加SMS4数据加密类型).研究 ...
- IO系统-基本知识
注:本文档主要整理了Linux下IO系统的基本知识,是整理的网易云课堂的学习笔记,老师讲得很不错,链接如下:Linux IO系统 1.Linux操作系统的基本构成 内核:操作系统的核心,负责管理系统的 ...
- 玩转Django2.0---Django笔记建站基础六(模型与数据库)
第六章 模型与数据库 Django对各种数据库提供了很好的支持,包括:PostgreSQL.MySQL.SQLite和Oracle,而且为这些数据库提供了统一的调用API,这些API统称为ORM框架. ...
- c#实现ofd文件转图片功能 (附执行程序)
前言 ofd文件的作用就是保证信息能如实的存储.传递.显示.保证ofd文件的真实性靠的是签名:ofd 的显示需要专用软件.ofd标准是新的国家标准,应用范围远不如pdf:现有浏览器不能解析ofd.支持 ...
- .NET 框架设计 - 模式、配置、工具 Demo 搜索
ps:http://www.ituring.com.cn/article/195770 看完第二章,我也忍了!但是随着第三章“副本”的开启,我的阅读速度开始慢慢的减缓,虽然对其中每一个程序模式的理论也 ...
- 解决delete 删除sql语句,标识还保留删除之前的问题
我有一些数据,想要删除,首先想到的是delete,但是它会保留之前的标识,后来想用truncate来进行删除,但是,它会全部删除,并且不能加条件,只能回过头使用delete,以下是解决delete删除 ...
- Spring-Cloud之Eureka注册中心环境搭建(单节点)
一 Eureka概述 服务启动时会生成服务的基本信息对象InstanceInfo,然后在启动时会register到服务治理中心. 注册完成后会从服务治理中心拉取所有的服务信息,缓存在本地. 之后服务会 ...