Question

我知道这个问题已经问了很多，但是即使我尝试了不同的情况，我似乎也找不到解决方案。

this.state = {
      chartTypes: [{name: 'Bar', id: 1},{name: 'Line', id: 2},{name: 'Pie', id: 3},{name: 'Radar', id: 4} ],
      selectedChart: [],
}

  onSelect = (selectedList, selectedItem) => {
   // selectedItem.name returns name of chartTypes, selectedItem.id returns id of chartTypes.

    this.setState({
      selectedChart: selectedItem.name
    })
  }
  
  onRemove = (selectedList, removedItem) => {
       // removedItem.name returns name of chartTypes, removedItem.id returns id of chartTypes.
  }

select选项工作正常，但我只是将其放在此处，以便您可以更好地理解。 onSelect将每个selectedItem.name放入selectedChart中。在删除功能上，如何根据值/索引从this.state.selectedChart中删除项目。

Answer 1

var newArray = this.state.selectedChart.filter((el)=> 
  el.id !==removedItem.id
);

过滤后

this.setState({selectedChart:newArray})

Answer 2

我认为您可以做类似的事情

    let temp = this.state.selectedChart;
    temp=temp.filter((item) => item !== removedItem.name);
    this.setState({ selectedChart: temp });

Answer 3

只需过滤并设置回状态

onRemove = (selectedList, removedItem) => {
      let filtered = this.state.chartTypes.filter(list=> list.id !==removedItem.id);
      this.setState({ chartTypes: filtered });
  }

从状态中删除项目

3 个答案: