elementui+vuejs如何添加表格操作按钮
<el-table :data="tableData" stripe border style="width:100%" highlight-current-row>
<el-table-column type="selection" width="55">
</el-table-column>
<el-table-column prop="phone" label="手机号" align="center" min-width="120">
</el-table-column>
<el-table-column prop="nickname" label="昵称" align="center" min-width="100">
</el-table-column>
<el-table-column prop="createTime" label="注册时间" align="center" min-width="120">
</el-table-column>
<el-table-column prop="enableState" label="用户状态" align="center" min-width="100">
</el-table-column>
<el-table-column prop="tradeState" label="交易状态" align="center" min-width="100">
</el-table-column>
<el-table-column label="操作" align="center" min-width="100">
<template slot-scope="scope">
<el-button type="text" @click="checkDetail(scope.row.phone)">查看详情</el-button>
<el-button type="info" @click="modifyUser(scope.row.phone)">修改</el-button>
<el-button type="info" @click="deleteUser(scope.row.phone)">删除</el-button>
</template>
</el-table-column>
</el-table>
//删除用户
deleteUser(val){
console.log(val)
//这里写相应的逻辑,val是指传进来的参数也就是上面的scope.row.phone;也可以是scope.row.nickname等
},
//修改用户
modifyUser(val){
let self = this;
},
//查看详情
checkDetail(val){
console.log(val)
}

elementui+vuejs如何添加表格操作按钮的更多相关文章
- Vue2.0+ElementUI+PageHelper实现的表格分页
Vue2.0+ElementUI+PageHelper实现的表格分页 前言 最近做了一些前端的项目,要对表格进行一些分页显示.表格分页的方法有很多,从宏观上来说分为物理分页和逻辑分页,由于逻辑分页(即 ...
- 基于element-ui的后台系统表格、dialog、筛选、自定义按钮、分页的一次性封装
方便基础业务开发封装的一套组件,基于vue2.5.x和element-ui,可以通过配置自动生成表格展示,表格新增.编辑功能.分页.筛选项.自定义显示表格数据等功能. 先上演示图片 --------- ...
- elementUI表单嵌套表格并对每行进行校验
elementUI表单嵌套表格并对每行进行校验 elementUI 表单嵌套表格并进行校验. 目录 效果展示 代码链接 关键代码 完整代码 效果展示 先看看这是不是需要的效果^_^ 如图,Elem ...
- OpenXml入门----给Word文档添加表格
下面将展示如何使用Openxm向Word添加表格. 代码中表头和数据我用的同一个TableRow来添加,其实可以通过TableHeader来,其实都一样.后面教程我会给出如何设置单元格样式.表头那一行 ...
- jquery 动态添加表格行
jquery 动态添加表格行 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <h ...
- VBA添加表格
Sub 添加表格() ' If MsgBox("要为所有表格添加列吗?", vbYesNo + vbQuestion) = vbYes Then To ActiveDocument ...
- C# 在Word中添加表格的方法
表格是组织整理数据的一种重要手段,应在生活中的方方面面.在Word文档中将繁杂的文字表述内容表格化,能快速.直接地获取关键内容信息.那么,通过C#,我们也可以在Word文档中添加表格,这里将介绍两种不 ...
- JQuery动态添加表格,然后动态删除不成功问题
背景: 自己做了一个测试网页,想动态添加表格,然后删除,按照网上的教程写完,发现点击"删除参数"按钮没用 源码: function addtr() { var trinfo = & ...
- Java 在PDF中添加表格
本文将介绍通过Java编程在PDF文档中添加表格的方法.添加表格时,可设置表格边框.单元格对齐方式.单元格背景色.单元格合并.插入图片.设置行高.列宽.字体.字号等. 使用工具:Free Spire. ...
随机推荐
- 安卓TV开发(八) 移动智能终端多媒体爬虫技术 获取加载网页视频源
转载请标明出处:http://blog.csdn.net/sk719887916/article/details/40049137,作者:skay 从上一篇学习中,学习了多媒体技术中的怎么去用josu ...
- how tomcat works 总结 二
第五章 servlet容器 第 5 章讨论 container 模块.container 指的是 org.apache.catalina.Container 接口,有4 种类型的 container: ...
- Android高通平台调试Camera驱动全纪录
项目比较紧,3周内把一个带有外置ISP,MIPI数据通信,800万像素的camera从无驱动到实现客户全部需求. 1日 搭平台,建环境,编译内核,烧写代码. 我是一直在Window下搭个虚拟机登服务器 ...
- 面试之路(3)-详解MVC,MVP,MVVM
一:mvc mvc结构: 视图(View):用户界面. 控制器(Controller):业务逻辑 模型(Model):数据保存 mvc各部分的通信方式 mvc互动模式 通过 View 接受指令,传递给 ...
- Android开发学习总结(二)——使用Android Studio搭建Android集成开发环境
有很长一段时间没有更新博客了,最近实在是太忙了,没有时间去总结,现在终于可以有时间去总结一些Android上面的东西了,很久以前写过这篇关于使用Android Studio搭建Android集成开发环 ...
- Linux下转换文件从GBK到UTF-8
iconv -f gbk -t utf- source-file -o target-file
- <mate name="viewport">移动端设置详解
<meta name="viewport" content="width=device-width,height=device-height,initial-sca ...
- 《深入理解Java虚拟机》读书笔记3--垃圾回收算法
转载:http://blog.csdn.net/tjiyu/article/details/53983064 下面先来了解Java虚拟机垃圾回收的几种常见算法:标记-清除算法.复制算法.标记-整理算法 ...
- ORACLE 分页查询
Oracle之分页查询 Oracle的分页查询语句基本上可以按照本文给出的格式来进行套用. 分页查询格式: SELECT * FROM ( SELECT A.*, ROWNUM RN FROM (SE ...
- JVM笔记8-虚拟机性能监控与故障处理工具
1.JDK命令行工具 Java开发人员肯定都知道JDK的bin目录有“java.exe”,"javac.exe"这两个命令行工具,但并非所有程序员都了解过JDK的bin目录之中其他 ...