Блог

Я знаю, что этот вопрос задавали много раз, но, похоже, я не нашел решения, даже если пробовал разные сценарии.

 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.
  }
  

Опция выбора работает нормально, но я просто поместил ее туда, чтобы вы могли лучше понять. onSelect помещает каждый selectedItem.name в selectedChart . В функции удаления, как я могу удалить элемент из this.state.selectedChart на основе значения / индекса.

Я думаю, вы можете сделать что-то вроде этого

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

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

после фильтрации

 this.setState({selectedChart:newArray})
  

Просто отфильтруйте и установите backed в состояние

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