说明:

1.改变表头居中问题:    需要在el-table-column中添加  header-align="center"

<el-table :data="tableData" style="width: 100%" >
                    <el-table-column prop="date" header-align="center" label="日期">
                    </el-table-column>
                    <el-table-column  prop="id" header-align="center" label="姓名">
                        <template slot-scope="scope">
                            <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row.id)">删除</el-button>
                        </template>
                    </el-table-column>

</el-table>

data() {
            return {
            
                tableData: [{
                    date: '描述描述描述描述描述',
                    id: '0'
                }, {
                    date: '描述描述描述描述描述',
                    id: '1'
                }, {
                    date: '描述描述描述描述描述',
                    id: '2'
                }, {
                    date: '描述描述描述描述描述',
                    id: '3'
                }]
            }
        },

methods: {
            handleDelete(index, row) {
                alert(index+"row=="+row);
            }
        }

vue2.0之element table的使用的更多相关文章

  1. vue2.0结合Element实现select动态控制input禁用

    今天有一个盆友问小颖,怎么实现用select动态控制input禁用,也就是说,input默认是可编辑的,但是每当我选一次select,input就会变成禁用,虽然小颖不知道她为什么这样做,因为小颖觉得 ...

  2. vue2.0实现在table中实现全选和反选

    其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...

  3. Vue2.0+Webpack+Element+Axios+vueRouter技术栈使用过程总结

    搭建项目架构 目采用Webpack+Vue-router的架构方式,开始安装(一切操作都在windows系统上完成) 1.按Win+R,然后在文本框中输入cmd,回车打开命令行,输入vue-cli安装 ...

  4. html一个页面链接携带参数跳转另一个页面基于vue2.0的element框架

    来给生活比个耶! 1.按钮 <el-button @click="albumList(scope.row.id)" size="mini" type=&q ...

  5. vue2.0+element+node+webpack搭建的一个简单的后台管理界面

    闲聊: 今天是六一儿童节哟,小颖祝大家节日快乐哈哈哈.其实这个demo小颖断断续续做了将近两个礼拜了,心塞的,其实这个也没有多难,主要是小颖有点最近事情有点多,所以就把这个一直拖着,今天好不容易做好了 ...

  6. vue2.0 + Element UI + axios实现表格分页

    注:本文分页组件用原生 html + css 实现,element-ui里有专门的分页组件可以不用自己写,详情见另一篇博客:https://www.cnblogs.com/zdd2017/p/1115 ...

  7. 基于vue2.0前端组件库element中 el-form表单 自定义验证填坑

    eleme写的基于vue2.0的前端组件库: http://element.eleme.io 我在平时使用过程中,遇到的问题. 自定义表单验证出坑: 1: validate/resetFields 未 ...

  8. vue2.0 element学习

    1,bootstrap和vue2.0结合使用 vue文件搭建好后,引入jquery和bootstrap 我采用的方式为外部引用 在main.js内部直接导入 用vue-cli直接安装jquery和bo ...

  9. 饿了么基于Vue2.0的通用组件开发之路(分享会记录)

    Element:一套通用组件库的开发之路 Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库.今天我们要分享的就是开发 Element 的一些心得. 官网 ...

随机推荐

  1. jmeter二次开发----Loadrunner或Jmeter发送邮件报告

    Loadrunner支持Java Vuser,而Jmeter本身就是基于Java开发的,所以两者都可以通过JMail组件实现邮件发送.本人使用的是mail-1.4.7.jar,可以通过下载获得:htt ...

  2. vim自动格式化

    ,gg 跳转到第一行 ,shift+v 转到可视模式 ,shift+g 全选 ,按下神奇的 = 你会惊奇的发现代码自动缩进了,呵呵,当然也可能是悲剧了.

  3. Struts2第三天

    ## Struts2第三天 ## ---------- **课程回顾:Struts2框架的第二天** 1. Servlet的API * ActionContext对象 * ServletActionC ...

  4. LeetCode119.杨辉三角II

    给定一个非负索引 k,其中 k ≤ 33,返回杨辉三角的第 k 行. 在杨辉三角中,每个数是它左上方和右上方的数的和. 示例: 输入: 3 输出: [1,3,3,1] 进阶: 你可以优化你的算法到 O ...

  5. jQuery-使用hover(fn,fn)函数监听mouseover和mouseout两个事件

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  6. quartz demo01

    1,Pom.xml   加入:quartz-2.1.7.jar <dependency> <groupId>org.quartz-scheduler</groupId&g ...

  7. java空心菱形

    图 1 要输出如图1所示的菱形,第一反应是看看这个菱形有什么特点.在草稿纸上比划了半天,将图1转化成了图2用数字表示的图 图 2 比较图1和图2发现有以下特点: (1)图2中的每一个数字代表图1中每个 ...

  8. EF切EFCore2.0存储过程问题

    在从EF切换成EFCore2.0的过程中,遇到了存储过程的实现问题. 在EF中调用存储过程,非常方便,能够直接将结果转换成对应的结果类. 如代码中的Database.SqlQuery<TElem ...

  9. Python全栈-数据库介绍与基本操作

    .数据库管理软件的由来 数据库的产生是为了解决数据的永久储存.数据安全.以及对方对外服务时能够实现并发服务等效果.例如解决前面所学的Scoket编程中,在不考虑硬件问题的基础上,服务端服务多个客户端时 ...

  10. table 的rolspan和rowspan

    如图所示啦,容易让初学者混乱的两个东西仔细看看分析下呢,就比较简单了 <table width="300" border="2"> <tr&g ...