javascript - 如何使用 key 从状态中删除项目

Question

我想从状态中删除一个项目。

我有想要删除的key id(如this.props.result._id)。

我希望通过 fetch(trash 函数)中的 .then 来运行此函数。

如何实现这一目标？

class Data extends React.Component {
  render(){
    const { hits } = this.props
    this.components = []
    return (
      <div>
        {hits.map(hit => 
          <ItemResult ref={ref => this.components.push(ref)} 
          key={hit._id} result={hit} />)}
      </div>
    )
  }
}

class ItemResult extends React.Component {
 constructor(props) {
    super(props);
    this.deleteItem = this.deleteItem.bind(this);
    this.state = {
      item: props.result,
    };
  }
  deleteItem = event => {
    // console.log('This gives undefined', item)
    this.setState({
      item: []
    })
  }
  render() {
    return (
      <div>
       <button onClick={this.deleteItem.bind(this)}> Delete </button>
          <h2> This appears {this.props.result.title}</h2>              
     </div>
    );
  }
}

Answer 1

您无法删除 props 键。您的情况有两种方法:

1. 从父组件调用任何回调(您在哪里指定此 Prop )并在那里删除/修改它
2. 但如果将此 prop 放置在组件的 state 中，效果会更好。然后您就可以按照自己的意愿使用它，而无需转发给 props。