功能

• 列表表格及分页 基于element-ui 组件进行二次封装

说明

由于表格配置项比较多，所以具体的每一项配置，可以查看 doc 目录具体的 md 文档

功能

1. 表格支持 json 配置
2. 支持加载 loading
3. 支持表格分页
4. 支持表格自定义组件渲染
5. 表格支持单选、多选处理，内置单选、多选回显逻辑处理
6. 表格支持滚动加载分页
7. 组件字段无缝衔接 element-ui 的 table 组件字段配置
8. 高度支持自定义，定制化

配置

属性	描述	类型	详情
data	表格所需要渲染的数据源	JSONArray	--
columns	表头数据及配置	JSONArray	columns 配置
pagination	表格分页数据配置	Object	pagination 配置
options	表格配置	JSONArray	options 配置
row-handle	表格操作列配置	JSONArray	row-handle 配置
loading-options	表格 loading 配置	Object	loading-options 配置
index-row	表格单选配置	Object	index-row 配置
selection-row	表格多选配置	Object	selection-row 配置
load-more-options	表格滚动加载更多配置	Object	load-more-options 配置

事件

属性	描述	类型	详情
events	表格可监听的事件	Function	events 配置

事件 methods

属性	描述	类型	详情
methods	表格调用的方法	Function	methods 配置

插槽 Slot

属性	描述	类型	详情
slots	表格可使用的插槽	String	slots 配置

安装

使用npm

npm i element-ui tabulation -S

使用yarn

yarn add element-ui tabulation

在项目中使用

在main.js中写入以下内容：

import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import Tabulation from 'tabulation'

Vue.use(ElementUI)
Vue.use(Tabulation)

new Vue({
  el: '#app',
  render: h => h(App)
})

之后就可以在项目中使用 Tabulation 了。