说明:

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. MongoDB--关于数据库及选择MongoDB的原因

    用户用数据库提供的接口将数据写入,数据会以标准的格式存储起来. 不同数据库的区别:存放数据的组织不同,同时提供不同种类的查询,用户按照自己的需求选择合适的数据库. 可以将地理位置存储在MongoDB中 ...

  2. go https json

    好吧,再来一个看起来高档点的吧 自从知道 Go有本地调用后,我就回到windows了 哈哈,以下内容,均在win10下搞定 预备:先做两个文件,服务器端的私钥KEY和公钥证书 1. openssl g ...

  3. Hibernate框架第三天

    **课程回顾:Hibernate第二天** 1. 持久化类和一级缓存 * 持久化类:JavaBean + 映射的配置文件 * 持久化对象的三种状态 * 瞬时态 * 持久态:有自动更新数据的能力 * 托 ...

  4. redhat7.5在H3C机器上黑屏无显

    现象:H3C机器上,PXE安装/ISO安装系统,多用户模式启动,过内核启动界面后,屏幕黑屏无显,但是可以通过SSH登陆系统,服务正常 环境:redhat7.5/H3C R4900G3/Purely平台 ...

  5. Spring.之.报错:Caused by: java.lang.ClassNotFoundException: org.aspectj.weaver.reflect.ReflectionWorld$ReflectionWorldException

    Caused by: java.lang.ClassNotFoundException: org.aspectj.weaver.reflect.ReflectionWorld$ReflectionWo ...

  6. python3学习笔记之安装

    一.Python安装 1.下载地址:  https://www.python.org/downloads/release/python-365/ 2. Linux系统自带Python2.7,如需安装3 ...

  7. docker中crontab无法执行

    1.下载的镜像是ubuntu最简版,默认没有安装crontab 2.业务需求需要crontab 最早解决方案 1.在宿主机里面 1 3  * * * root  cd /data/wwwroot/xx ...

  8. c# 修改xml格式config文件

    xml 格式的config文件如下: <?xml version="1.0" encoding="utf-8"?> <configuratio ...

  9. Self hosted OWIN 绑定地址127.0.0.1,外网无法访问

    static void Main()         {             string baseAddress = "http://localhost:4004/";   ...

  10. C#深入研究ArrayList动态数组自动扩容原理

    1 void Test1() { ArrayList arrayList = new ArrayList(); ; ; i < length; i++) { arrayList.Add(&quo ...