代码拉取完成，页面将自动刷新
React GridTree is a react component built to easily render a table showing the properties of objects in a tree structure.
Check out the example project and the live demo
npm install react-gridtree
Example:
<GridTree
data={[
{
name: "item 1"
qty: 2,
children: [
{
name: "item 1.1",
qty: 1
}
]
},
{
name: "item 2",
qty: 4
}
]}
options={{
fields: [
{
property: 'name',
displayName: 'Name',
width: '70%'
},
{
property: 'qty',
displayName: 'Quantity',
format: (value) => value.toFixed(2)
}
]
}}
/>
Notes:
- Styling not yet supported
- The children attribute is reserved for the objects that will be shown inside the parent
data
Data to be displayed. Should be an array of objects. Each object's children property should be an array of nested objects.
data = [
{
name: "item 1"
qty: 2,
children: [
{
name: "item 1.1",
qty: 1
}
]
},
{
name: "item 2",
qty: 4
}
]
options Object that can contain the properties:
fields - Required fields should be an array containing one object for each data property that should be displayed. This object can have the properties:
property - Required The name of the data property (e.g. "name")
displayName - Required The text to be shown on the table header (e.g. "Name")
width The width of the column (e.g. "50%")
format
A function that receives the data value, and returns a formatted text to be shown (e.g. (value) => value.toFixed(2)
options = {
fields: [
{
property: 'name',
displayName: 'Name',
width: '70%'
},
{
property: 'qty',
displayName: 'Quantity',
format: (value) => value.toFixed(2)
}
]
}
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。