Question

我有需要在表中显示的数据，对于所有行，我都想使用折叠功能。现在，我的工作代码可以折叠所有单击的行，但是用哪种方式只能折叠一个已经单击的行？

这是我的代码：

class Data extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            datas: [
                {name: "or1", status: 11},
                {name: "or3", status: 2},
                {name: "or2", status: 22},
            ],
            expanded: [],
            isOpen: true,
        };
    }

    toogleContent(openIs) {
        this.setState({
            isOpen: !openIs
        })
    }

    render() {
        return (
            <Table responsive>
                <thead className="text-primary">
                <tr>
                    <th>Name</th>
                    <th>Status</th>
                </tr>
                </thead>
                <tbody>
                {this.state.datas.map((data, i) => (
                    <tr id={i} onClick={this.toogleContent.bind(this, this.state.isOpen)}>
                        <td>{data.name}</td>
                        <td><Collapse isOpen={this.state.isOpen}> 
                           {data.status}</Collapse>
                        </td>
                    </tr>
                ))}
                </tbody>
            </Table>
        )
    }
}

Answer 1

我使用了它们的索引来查找它们是否已打开，但是您也可以使用它们的名称，或在数据对象上添加一个isOpened =>

curl -X POST -H 'Content-Type: application/json' neptune-endpoint:8182/loader -d '
{
      "source" : "s3-URL",
      "format" : "csv",
      "iamRoleArn" : "arn:aws:iam::",
      "region" : "us-east-2",
      "failOnError" : "FALSE",
      "parallelism" : "MEDIUM",
      "updateSingleCardinalityProperties" : "FALSE"
}'

反应折叠行onClick

1 个答案: