2018-04-03 14:18:18 +00:00
|
|
|
|
<script>
|
2019-01-12 03:33:27 +00:00
|
|
|
|
import Ajax from './ajax.md';
|
|
|
|
|
|
import Basic from './basic.md';
|
|
|
|
|
|
import Bordered from './bordered.md';
|
|
|
|
|
|
import ColspanRowspan from './colspan-rowspan.md';
|
|
|
|
|
|
import CustomFilterPanel from './custom-filter-panel.md';
|
|
|
|
|
|
import EditCell from './edit-cell.md';
|
|
|
|
|
|
import EditRow from './edit-row.md';
|
|
|
|
|
|
import ExpandChildren from './expand-children.md';
|
|
|
|
|
|
import Expand from './expand.md';
|
|
|
|
|
|
import FixedColumnsHeader from './fixed-columns-header.md';
|
|
|
|
|
|
import FixedColumns from './fixed-columns.md';
|
|
|
|
|
|
import FixedHeader from './fixed-header.md';
|
|
|
|
|
|
import GroupingColumns from './grouping-columns.md';
|
|
|
|
|
|
import Head from './head.md';
|
|
|
|
|
|
import NestedTable from './nested-table.md';
|
|
|
|
|
|
import ResetFilter from './reset-filter.md';
|
|
|
|
|
|
import RowSelectionAndOperation from './row-selection-and-operation.md';
|
|
|
|
|
|
import RowSelectionCustom from './row-selection-custom.md';
|
|
|
|
|
|
import RowSelection from './row-selection.md';
|
|
|
|
|
|
import Size from './size.md';
|
|
|
|
|
|
import Template from './template.md';
|
|
|
|
|
|
import CN from '../index.zh-CN.md';
|
|
|
|
|
|
import US from '../index.en-US.md';
|
2018-04-03 14:18:18 +00:00
|
|
|
|
|
|
|
|
|
|
const md = {
|
|
|
|
|
|
cn: `# Table 表格
|
|
|
|
|
|
|
|
|
|
|
|
展示行列数据。
|
|
|
|
|
|
|
|
|
|
|
|
## 何时使用
|
|
|
|
|
|
|
|
|
|
|
|
- 当有大量结构化的数据需要展现时；
|
|
|
|
|
|
- 当需要对数据进行排序、搜索、分页、自定义操作等复杂行为时。
|
|
|
|
|
|
|
|
|
|
|
|
## 如何使用
|
|
|
|
|
|
|
|
|
|
|
|
指定表格的数据源 \`dataSource\` 为一个数组。
|
|
|
|
|
|
## 代码演示`,
|
|
|
|
|
|
us: `# Table
|
|
|
|
|
|
|
|
|
|
|
|
A table displays rows of data.
|
|
|
|
|
|
|
|
|
|
|
|
## When To Use
|
|
|
|
|
|
|
|
|
|
|
|
- To display a collection of structured data.
|
|
|
|
|
|
- To sort, search, paginate, filter data.
|
|
|
|
|
|
|
|
|
|
|
|
## How To Use
|
|
|
|
|
|
|
|
|
|
|
|
Specify \`dataSource\` of Table as an array of data.
|
2019-01-05 10:09:27 +00:00
|
|
|
|
## Examples
|
2018-04-03 14:18:18 +00:00
|
|
|
|
`,
|
2019-01-12 03:33:27 +00:00
|
|
|
|
};
|
2018-04-03 14:18:18 +00:00
|
|
|
|
export default {
|
|
|
|
|
|
category: 'Components',
|
|
|
|
|
|
cols: 1,
|
|
|
|
|
|
type: 'Data Display',
|
|
|
|
|
|
title: 'Table',
|
|
|
|
|
|
subtitle: '表格',
|
|
|
|
|
|
render () {
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<md cn={md.cn} us={md.us}/>
|
2019-04-30 10:27:47 +00:00
|
|
|
|
<Ajax />
|
|
|
|
|
|
<Basic />
|
|
|
|
|
|
<Bordered />
|
|
|
|
|
|
<ColspanRowspan />
|
2018-04-03 14:18:18 +00:00
|
|
|
|
<CustomFilterPanel />
|
2019-04-30 10:27:47 +00:00
|
|
|
|
<EditCell />
|
|
|
|
|
|
<EditRow />
|
|
|
|
|
|
<ExpandChildren />
|
|
|
|
|
|
<Expand />
|
|
|
|
|
|
<FixedColumnsHeader />
|
|
|
|
|
|
<FixedColumns />
|
|
|
|
|
|
<FixedHeader />
|
|
|
|
|
|
<GroupingColumns />
|
|
|
|
|
|
<Head />
|
|
|
|
|
|
<NestedTable />
|
|
|
|
|
|
<ResetFilter />
|
|
|
|
|
|
<RowSelectionAndOperation />
|
|
|
|
|
|
<RowSelectionCustom />
|
|
|
|
|
|
<RowSelection />
|
|
|
|
|
|
<Size />
|
|
|
|
|
|
<Template />
|
2018-04-03 14:18:18 +00:00
|
|
|
|
<api>
|
|
|
|
|
|
<template slot='cn'>
|
|
|
|
|
|
<CN/>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<US/>
|
|
|
|
|
|
</api>
|
|
|
|
|
|
</div>
|
2019-01-12 03:33:27 +00:00
|
|
|
|
);
|
2018-04-03 14:18:18 +00:00
|
|
|
|
},
|
2019-01-12 03:33:27 +00:00
|
|
|
|
};
|
2018-04-03 14:18:18 +00:00
|
|
|
|
</script>
|
