vue2.0之element table的使用
说明:
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的使用的更多相关文章
- vue2.0结合Element实现select动态控制input禁用
今天有一个盆友问小颖,怎么实现用select动态控制input禁用,也就是说,input默认是可编辑的,但是每当我选一次select,input就会变成禁用,虽然小颖不知道她为什么这样做,因为小颖觉得 ...
- vue2.0实现在table中实现全选和反选
其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...
- Vue2.0+Webpack+Element+Axios+vueRouter技术栈使用过程总结
搭建项目架构 目采用Webpack+Vue-router的架构方式,开始安装(一切操作都在windows系统上完成) 1.按Win+R,然后在文本框中输入cmd,回车打开命令行,输入vue-cli安装 ...
- html一个页面链接携带参数跳转另一个页面基于vue2.0的element框架
来给生活比个耶! 1.按钮 <el-button @click="albumList(scope.row.id)" size="mini" type=&q ...
- vue2.0+element+node+webpack搭建的一个简单的后台管理界面
闲聊: 今天是六一儿童节哟,小颖祝大家节日快乐哈哈哈.其实这个demo小颖断断续续做了将近两个礼拜了,心塞的,其实这个也没有多难,主要是小颖有点最近事情有点多,所以就把这个一直拖着,今天好不容易做好了 ...
- vue2.0 + Element UI + axios实现表格分页
注:本文分页组件用原生 html + css 实现,element-ui里有专门的分页组件可以不用自己写,详情见另一篇博客:https://www.cnblogs.com/zdd2017/p/1115 ...
- 基于vue2.0前端组件库element中 el-form表单 自定义验证填坑
eleme写的基于vue2.0的前端组件库: http://element.eleme.io 我在平时使用过程中,遇到的问题. 自定义表单验证出坑: 1: validate/resetFields 未 ...
- vue2.0 element学习
1,bootstrap和vue2.0结合使用 vue文件搭建好后,引入jquery和bootstrap 我采用的方式为外部引用 在main.js内部直接导入 用vue-cli直接安装jquery和bo ...
- 饿了么基于Vue2.0的通用组件开发之路(分享会记录)
Element:一套通用组件库的开发之路 Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库.今天我们要分享的就是开发 Element 的一些心得. 官网 ...
随机推荐
- jmeter二次开发----Loadrunner或Jmeter发送邮件报告
Loadrunner支持Java Vuser,而Jmeter本身就是基于Java开发的,所以两者都可以通过JMail组件实现邮件发送.本人使用的是mail-1.4.7.jar,可以通过下载获得:htt ...
- vim自动格式化
,gg 跳转到第一行 ,shift+v 转到可视模式 ,shift+g 全选 ,按下神奇的 = 你会惊奇的发现代码自动缩进了,呵呵,当然也可能是悲剧了.
- Struts2第三天
## Struts2第三天 ## ---------- **课程回顾:Struts2框架的第二天** 1. Servlet的API * ActionContext对象 * ServletActionC ...
- LeetCode119.杨辉三角II
给定一个非负索引 k,其中 k ≤ 33,返回杨辉三角的第 k 行. 在杨辉三角中,每个数是它左上方和右上方的数的和. 示例: 输入: 3 输出: [1,3,3,1] 进阶: 你可以优化你的算法到 O ...
- jQuery-使用hover(fn,fn)函数监听mouseover和mouseout两个事件
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- quartz demo01
1,Pom.xml 加入:quartz-2.1.7.jar <dependency> <groupId>org.quartz-scheduler</groupId&g ...
- java空心菱形
图 1 要输出如图1所示的菱形,第一反应是看看这个菱形有什么特点.在草稿纸上比划了半天,将图1转化成了图2用数字表示的图 图 2 比较图1和图2发现有以下特点: (1)图2中的每一个数字代表图1中每个 ...
- EF切EFCore2.0存储过程问题
在从EF切换成EFCore2.0的过程中,遇到了存储过程的实现问题. 在EF中调用存储过程,非常方便,能够直接将结果转换成对应的结果类. 如代码中的Database.SqlQuery<TElem ...
- Python全栈-数据库介绍与基本操作
.数据库管理软件的由来 数据库的产生是为了解决数据的永久储存.数据安全.以及对方对外服务时能够实现并发服务等效果.例如解决前面所学的Scoket编程中,在不考虑硬件问题的基础上,服务端服务多个客户端时 ...
- table 的rolspan和rowspan
如图所示啦,容易让初学者混乱的两个东西仔细看看分析下呢,就比较简单了 <table width="300" border="2"> <tr&g ...