Question

我正在使用react-table.js从表单中获取数据，但我希望能够从表中删除数据。按钮正在工作，所以我知道它已正确连接，但我似乎无法删除它。这是代码

    handleDelete = item => {
    var newArr = [];
    const newState = this.props.documentation;
    for (var key in newState) {
      if (newState.hasOwnProperty(key)) {
        let data = newState[key];
        data.id = key;
        newArr.push(newState[key]);
      }
      const sliceArr = newArr.slice();
      if (sliceArr.indexOf(item) > -1) {
        sliceArr.slice(sliceArr.indexOf(item), 1);
      }
      console.log('New Array', sliceArr);
      this.setState({ data: sliceArr });
    }
  };

连同按钮我将它附加到

Cell: row => (
          <div>
            <button onClick={() => this.handleDelete(row.id)}>Delete</button>
          </div>

Answer 1

你正在寻找拼接而不是切片：

  const spliceArr = newArr.slice();
  if (spliceArr.indexOf(item) > -1) {
    spliceArr.splice(spliceArr.indexOf(item), 1);
  }
  console.log('New Array', spliceArr);
  this.setState({ data: spliceArr });

示例：

const newArr = [1, 2, 3, 4]
// [1, 2, 3, 4] example
const spliceArr = newArr.slice()
// [1, 2, 3, 4] ok
spliceArr.slice(spliceArr.indexOf(3), 1)
spliceArr
// [1, 2, 3, 4] oops
spliceArr.splice(spliceArr.indexOf(3), 1)
spliceArr
// [1, 2, 4]    better

如果那并不能让你一直到达那里，你可能想要用表格本身的渲染（大概是JSX）来更新你的问题，正如@MichaelBenin建议的那样。

从react-table中删除数据

1 个答案: