README
contrast-table
Element-UI
Table
组件封装的高阶表格组件,可无缝支持 element 的 table 组件。
contrast-table是基于 开发
npm install
npm run dev
npm run build
使用
安装 Element:
npm i element-ui -S
安装 contrast-table:
npm i contrast-table -S
局部引入contrastTable
import contrastTable from 'contrastTable'
components: {
contrastTable
}
contrast-table在elements ui table上做了封装,专门用于数据对比(竖型)表格,接收后端返回的常见对象格式,参见tableData contrast-table支持多列数据对比,支持定制表头,传入tableFields字段即可
<template>
<div id="app">
<contrast-table :tableData="tableData" :tableFields="tableFields"></contrast-table>
</div>
</template>
<script>
import contrastTable from 'contrast-table'
export default {
name: 'app',
components: {
contrastTable
},
data () {
return {
tableData: {
zd1: ['字段一', 'aaa', 'bbb'],
zd2: ['字段二', 'ccc', 'hhh'],
zd3: ['字段三', 'fsadf', 'sdfsdffsdg']
},
tableFields: ['第一列数据', '第二列数据']
}
}
}
</script>
<style lang="scss">
</style>