Никак не могу понять, почему при использовании splice удаляется весь массив. Возле каждого li есть кнопка, при нажатии на которую удаляется именно этот элемент li. Но удаляется весь массив.
class App extends React.Component {
constructor() {
super();
this.state = {arr: ['Коля', 'Вася', 'Петя', 'Иван', 'Дима']};
this.addItem = this.addItem.bind(this);
this.deleteItem = this.deleteItem.bind(this);
}
deleteItem(index) {
this.setState({arr: this.state.arr.splice(index, 1)});
}
render() {
const list = this.state.arr.map((item, index) => {
return <li key={index}>
{item}
<button onClick={this.deleteItem}>Delete me</button>
</li>;
});
return (
<ul>
{list}
</ul>
);
}
}
Нашла решение, но правильно ли понимаю, что там непосредственно меняется state и так делать нельзя.
deleteItem(index) {
this.state.items.splice(index, 1);
this.setState({items: this.state.items});
}