Question

我想在react的组件框架中使用递归嵌套表：antd，但它不会像这样工作：

import {Table, Badge, Menu, Dropdown, Icon} from 'antd';
export  default  class TreeTable extends React.Component {

    constructor(props) {
        super(props)
        this.state = {
            dataSource: [],
            nestedData: []
        }
    }



    expandedRowRender(e) {

        const nested_source = e.nest_data

        const columns = this.props.nest_columns

        return (
            <Table
                columns={columns}
                dataSource={nested_source}
                pagination={false}
                expandedRowRender={(e)=>{this.expandedRowRender(e)}}
                title={()=>"一级岗位列表"}
                showHeader={false}
                size={"middle"}
            />

        );
    }

    render() {
        const data_source = this.props.data_source.map((v, i)=> {
            return {key: i, ...v}
        })

        return (
            <div >
                <Table
                    className="components-table-demo-nested"
                    columns={this.props.columns}
                    expandedRowRender={(e)=>::this.expandedRowRender(e)}
                    dataSource={data_source}
                />
                { this.props.children }
            </div>
        )
    }


}

当我点击桌面上的第二级加按钮时，没有发生任何事情，如何解决这个问题？这是一个错误吗？

Answer 1

首先，我想回答你的第一个问题

这是一个错误吗？

不，这不是Bug。如果您没有为每个表行设置唯一键值，就会发生这种情况。将此代码段添加到您的＆＃34;表＆＃34;标签。

rowKey = {e =＆gt; e._id}

例如： -

         <Table
                rowKey = {e=> e._id}
                className="components-table-demo-nested"
                columns={this.props.columns}
                expandedRowRender={(e)=>::this.expandedRowRender(e)}
                dataSource={data_source}
            />

蚂蚁设计递归嵌套表不工作

1 个答案: