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 是带 ...
随机推荐
- 【python系统学习06】一张图看懂列表并学会操作
点击跳转-原文地址 数据类型 - 列表(list) 「目录:」 一张图了解列表 列表是什么 列表长啥样 语法格式 代码示例 格式特征 列表定义 列表操作 - 提取单个:偏移量 什么是偏移量 偏移量提取 ...
- jenkins集成jmeter-进阶篇
1.gitlab自动触发jenkins构建 1⃣️安装插件: 2⃣️新建工程,设置git url,build when a change is pushed auto.sh /bin/sh echo ...
- 虚拟环境vitualenv的使用
在使用 Python 开发的过程中,工程一多,难免会碰到不同的工程依赖不同版本的库的问题: 亦或者是在开发过程中不想让物理环境里充斥各种各样的库,引发未来的依赖灾难. 此时,我们需要对于不同的工程使用 ...
- mysql安装教程linux
https://www.cnblogs.com/YangshengQuan/p/8431520.html 设置sql远程访问
- RSTP协议简介
RTSP(Real-Time Stream Protocol)协议是一个基于文本的多媒体播放控制协议,属于应用层.RTSP以客户端方式工作,对流媒体提供播放.暂停.后退.前进等操作.该标准由IETF指 ...
- springboot集成quartz实现任务调度
quartz 概述 特点 强大的调度功能 灵活的应用方式 分布式和集群能力 用到的设计模式 Builder 模式 factory模式 组件模式 链式写法 体系结构 调度器 任务 触发器 架构图 spr ...
- java操作数组转list集合删除元素报错ConcurrentModificationException
public static void main(String[] args) { ArrayList<String> list = new ArrayList<String>( ...
- Shell常用命令之printf
printf 内容格式化输出 格式 printf [format] [输入内容] format参数 %b:打印相关内容并解释其中反斜杠"\"的特殊字符 %q:以shell引用的格式 ...
- K8s下部署Istio
一.环境准备 1.1环境信息 主机名 IP地址 用途 zhengzw-k8s-master 10.10.100.7 K8s Master zhengzw-k8s-node-1 10.10.100.15 ...
- Tiny Linux -- tce-load
Tiny Linux which has its own package manager called "tce-load". There's a list of packages ...