table-generator

$3

- 数据驱动表格渲染
- 支持分页器使用
- 目前版本是基于element-ui实现的，需要项目中引入element-ui方可使用
- 可通过配置页面生成表格配置信息，该页面下文统称为表格生成器，生成器访问地址为 http://canfoo.github.io/web/table-generator/index.html#/config/table

$3

$3

``bash
$ git clone https://github.com/canfoo/table-generator.git
`

`bash
npm install
`

`bash
npm run start
`
访问http://localhost:3999/#/demo

$3

`bash
npm run test
`

$3

安装

`bash
$ npm install table-generator --save
`

引入

`js
import tableGenerator from 'table-generator';
Vue.use(tableGenerator);
`

配置表格组件库目录（表格配置组件库类型，会从组件库根据名称加载相同名称的组件，支持多层目录，注意：需要确保组件库的组件名是唯一的）

`js
tableGenerator.repository(() => require.context(path));
// path为组件库目录路径，必须显示传入，不可传入变量。例如可以写成require.context('../components')；不能写成 let cPath = '../components'; require.context(cPath);
`

配置表格表格枚举库（表格配置枚举表时，可以从枚举库通过名称加载名称相同的枚举表，支持嵌套写法，例如 'mapName.hotelType'）

`js
tableGenerator.enumerator(() => require(path));
// path为组件库目录路径，必须显示传入，不可传入变量。例子见上文
``

$3

可以通过表格生成器页面快速生成列配置表(columnOptions)的参数。
生成步骤：
1.粘贴表格的mock数据
2.根据mock数据配置表格列信息
3.生成columnOptions参数列表（直接拷贝到业务代码里面，传入到tableGenerator组件props的columnOptions字段里，即可生成表格）

!Mou icon

!Mou icon