React - 无法从表中删除行

Question

我在React中有下表：

<div>
            <table class="table table-condensed table-bordered">
                <tr>
                    <th>List Names</th>
                    <th>List Full Names</th>
                    <th>List Descriptions</th>
                </tr>
                <tbody>{this.displayTableBody()}</tbody>
            </table>

            <button style={{display:'inline-block'}} type="button" className="btn btn-primary btn-small"
            onClick={this.addList}>
                <span className="glyphicon glyphicon-plus"></span>
            </button>

            <button style={{display:'inline-block'}} type="button" className="btn btn-primary btn-small"
                    onClick={this.removeList}>
                <span className="glyphicon glyphicon-minus"></span>
            </button>

        </div>

displayTableBody方法显示表格的正文：

displayTableBody: function() {
    var rows = Array.apply(null, Array(this.state.rowNr)).map(
        function(e1, index) {
            return <ListInput key={index} ref={index}/>
        }
    );
    return { rows };
}

ListInput代表表格的一行：

return (
    <tr>
        <td>{this.displaySimpleInputField(
            "List Name(<15 characters - A-Z, 0-9 and _ only)", this.setListName, "input")}</td>
        <td>{this.displaySimpleInputField(
            "List Full Name(<75 characters)", this.setListFullName, "input")}</td>
        <td>{this.displaySimpleInputField(
            "List Description(<225 characters)", this.setListDescription, "input")}</td>
    </tr>
)

该表有一个要添加的按钮，另一个用于删除行。 单击按钮删除行时，将调用此方法：

removeList: function() {
    this.setState({rowNr: this.state.rowNr - 1});
},

我可以添加行。 但是，当我尝试删除行时，我得到：

Uncaught Error: Invariant Violation: receiveComponent(...): Can only update a mounted component.