Я хочу удалить элемент из массива, получая target.id, это приложение для корзины, иными словами, я хочу удалить элемент из корзины, когда нажимаю на значок корзины.
<span style={{fontSize:'50px'}}>Basket</span>
<ul style={{listStyle: 'none'}}>
{this.state.clickedNum.map((i) => <li key =
{this.props.gameData.id[i]} value={i}>
{this.props.gameData.gameNames[i]} <br/>
<img src={require('../assets/coins.png')} style={{width:'20px'}}/>
<strong> {this.props.gameData.prices[i]} Gil </strong>
<img src={require('../assets/bin.png')} style={{width:'20px', justifyContent:' flex-end'}} id={this.props.gameData.id[i]} onClick={this.removeClick}/>
<br/>
<hr style={{borderColor:'black'}} />
</li>
</ul>
Это функция onClick = {this.removeClick}:
removeClick = (e) => {
e = e.target.id;
let clickedNum = this.state.clickedNum;
let isDisabled = this.state.isDisabled;
console.log("this is i" + e);
clickedNum.splice(e, 1);
isDisabled.splice(e,1);
this.setState({
clickedNum: clickedNum,
isDisabled:isDisabled
})
this.forceUpdate();
}
удаление клика связывается так в функции constructor :
this.removeClick = this.removeClick.bind(this);
Проблема заключается в том, что если щелкнуть корзину, если в корзине более одного товара, первый элемент не удаляется и не всегда удаляется нужный товар, однако, если в корзине есть только один товарудалит правильное.
Также отмечу, что:
console.log("this is i" + e);
возвращает правильное значение (идентификатор кнопки, на которой оно было нажато)