UNPKG

@alicloud/console-components

Version:

Alibaba Cloud React Components

86 lines (85 loc) 3.06 kB
/** * title: "树状表格" * description: "" */ import React from 'react'; import { Table } from '@alicloud/console-components'; import Actions, { LinkButton } from '@alicloud/console-components-actions'; var data = [ { id: 1, name: '实例名称', status: '成功', type: '专有网络', children: [ { id: 11, name: '实例名称', status: '成功', type: '专有网络', }, { id: 12, name: '实例名称', status: '成功', type: '专有网络', children: [ { id: 121, name: '实例名称', status: '失败', type: '专有网络', }, ], }, { id: 13, name: '实例名称', status: '失败', type: '专有网络', children: [ { id: 131, name: '实例名称', status: '失败', type: '专有网络', children: [ { id: 1311, name: '实例名称', status: '失败', type: '专有网络', }, { id: 1312, name: '实例名称', status: '失败', type: '专有网络', }, ], }, ], }, ], }, { id: 2, name: '实例名称', status: '失败', type: '专有网络', }, ]; var render = function () { return (React.createElement(Actions, null, React.createElement(LinkButton, { onClick: function () { } }, "\u64CD\u4F5C\u9879"), React.createElement(LinkButton, { onClick: function () { } }, "\u64CD\u4F5C\u9879"), React.createElement(LinkButton, { onClick: function () { } }, "\u64CD\u4F5C\u9879"), React.createElement(LinkButton, { onClick: function () { } }, "\u64CD\u4F5C\u9879"))); }; export default (function () { return (React.createElement(Table, { dataSource: data, primaryKey: "id", isTree: true }, React.createElement(Table.Column, { title: "\u5B9E\u4F8BID/\u540D\u79F0", dataIndex: "name", width: 200 }), React.createElement(Table.Column, { title: "\u72B6\u6001", dataIndex: "status" }), React.createElement(Table.Column, { title: "\u7F51\u7EDC\u7C7B\u578B", dataIndex: "type" }), React.createElement(Table.Column, { title: "\u64CD\u4F5C", cell: render, width: 200 }))); });