I am an app where I a user can add a productItem to a Basket. At the moment if the user removes an item from the basket I am using .filter to remove the basketItem object from my basketItems array. I then setState to this array with the filtered item.
removeItem(msg, data) {
let newStateItems = this.state.items.filter((i) => i.id != data.id);
this.setState({
items: newStateItems
});
this.calculateTotals();
}
The issue however is that once I have removed an item and then go to add another Item, the new Item that is created shows as the old item until the page is refreshed - an example this app can be found here and the full repository is on github.
The add item call looks like this:
addItem(msg, data) {
this.state.items.push(data);
this.setState({
items: this.props.items
})
this.calculateTotals();
}
How can I ensure that the correct item shows in the basket?