说明:

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. Oracle相关安装经验总结

    1. 安装的是oracle 12c client for windows,从同事处拿到的,说是64位的,不过我没有找到包含有64这样的文件名或者里面内容有64位的.从同事处拿到的plsqldev110 ...

  2. 12月centos单词

    ---恢复内容开始--- UNreachable:adj.(network server unreachable) 不能达到的; 及不到的; 取不到的; 不能得到的; rsync: rsync [re ...

  3. Version Control,Git的下载与安装

    一.什么是Version Control(版本控制系统)?  ——来自百度百科 以Git为例,是一个开源的分布式版本控制系统,可以有效.高速地处理从很小到非常大的项目版本管理.Git 是 Linus ...

  4. iframe中父页面与子页面的传值方法

    涉及到iframe传值的情况有这么几种:(1)父页面给iframe中的子页面传值(2)子页面调用父页面中的函数(3)iframe中的子页面给父页面传值(4)兄弟iframe之间的传值 下面来逐一看一下 ...

  5. oracle查询数据字典的sql

    使用的sql语句如下: select t1.username 用户, t2.TABLE_NAME 表名称, t3.comments 表业务含义, t2.COLUMN_NAME 字段名称, t4.com ...

  6. 有关g++的Xlinker选项

    事情的起因是,在使用Eclipse配置opencv的库时,发现使用-Wl 选项需要自己在Linker flags的输入框里指定.并不是像使用-l选项或-I选项那样可以直接添加选项的条目就可以了.但是在 ...

  7. finally语句块

    finally语句块是搭配着try语句块出现的,也就说必须有try语句块才会有finally语句块,但是并不是try语句块都会搭配有finally语句块出现,我们常见的更多是try...catch.. ...

  8. 软工网络15团队作业4——Alpha阶段敏捷冲刺2.0

    软工网络15团队作业4--Alpha阶段敏捷冲刺2.0 1.提供当天站立式会议照片一张. 2.每个人的工作 成员 昨天已完成 今天计划完成 郭炜埕 熟悉微信web开发者工具 完成新建话题界面的设计 郑 ...

  9. mysql 知识

    1.  数据库事务的四个特性及含义 数据库事务transanction正确执行的四个基本要素.ACID,原子性(Atomicity).一致性(Correspondence).隔离性(Isolation ...

  10. .NET Core Tools for Visual Studio 2015 安装失败

    You may be blocked from installing the .NET Core Tooling Preview 2 for Visual Studio 2015 installer ...