ant-design-vue/components/vc-table/demo/jsx.js

37 lines
1002 B
JavaScript
Raw Normal View History

2018-03-27 22:41:41 +08:00
/* eslint-disable no-console,func-names,react/no-multi-comp */
2019-01-12 11:33:27 +08:00
import Table from '../index';
import '../assets/index.less';
2018-03-27 22:41:41 +08:00
2019-01-12 11:33:27 +08:00
const { ColumnGroup, Column } = Table;
2018-03-27 22:41:41 +08:00
const data = [
{ a: '123', key: '1' },
{ a: 'cdd', b: 'edd', key: '2' },
{ a: '1333', c: 'eee', d: 2, key: '3' },
2019-01-12 11:33:27 +08:00
];
2018-03-27 22:41:41 +08:00
export default {
2019-01-12 11:33:27 +08:00
render() {
2018-03-27 22:41:41 +08:00
return (
<div>
<h2>JSX table</h2>
<Table data={data}>
2018-03-29 18:18:41 +08:00
<ColumnGroup>
2019-01-12 11:33:27 +08:00
<span slot="title">Bazingakkkk</span>
<Column title="title1" dataIndex="a" key="a" width={100} />
<Column id="123" title="title2" dataIndex="b" key="b" width={100} />
2018-03-27 22:41:41 +08:00
</ColumnGroup>
2019-01-12 11:33:27 +08:00
<Column title="title3" dataIndex="c" key="c" width={200} />
2018-03-27 22:41:41 +08:00
<Column
2019-01-12 11:33:27 +08:00
title="Operations"
dataIndex=""
key="d"
2018-03-29 18:18:41 +08:00
// render={() => <a href='#'>Operations</a>}
2019-01-12 11:33:27 +08:00
scopedSlots={{ default: () => <a href="#">Operations</a> }}
/>
2018-03-27 22:41:41 +08:00
</Table>
</div>
2019-01-12 11:33:27 +08:00
);
2018-03-27 22:41:41 +08:00
},
2019-01-12 11:33:27 +08:00
};