问题
I'm running into a bug where I use the spread operator to delete an object property. I tested the code in the console and it works there but I'm unclear why it's not working in my React App. Here's my other question for reference and now I'm using the accepted answer's code line by line: https://stackoverflow.com/questions/64000577/rest-operator-to-omit-properties
.
I followed the entire debug path in the Source tab using breakpoint. I get inside the if statement and when it's time to destructure state, the value of removedBooks from ...removedBooks
still has entry 345. If the destructure had occurred correctly, the object property for 345 would no longer be in removedBooks. This is where my bug is. I really hope I'm not making another silly mistake with nesting. I added the rest of code for context, just in case there are some unintended side effects.
handleBookRestore(book){
axios
.patch(
`/api/books/${book.id}/listings/${book.listingIds[0]}/restore`
)
.then(response => {
console.log(response);
//After successful restore, we remove the first listingId in the
// list of corresponding listings for that removed book.
//IF there was only one listingID left, then remove the book.
this.setState(
state => {
const listingIds =
state.removedBooks[book.id].listingIds;
if (listingIds.length == 1) {
const {
removedBooks: { [book.id]: data, ...removedBooks }
} = state;
return { ...state, removedBooks };
} else {
return {
...state,
removedBooks: {
...state.removedBooks,
[book.id]: {
...book,
listingIds: listingIds.slice(1)
}
}
};
}
},
() => {
this.props.onNotificationUpdate({
type: "book_restore_success",
data: { title: book.title }
});
}
);
});
}
Relevant values at code run time
state = {
"345": {
"id": 345,
"title": "Among the Thugs",
"listingIds": [
2065
]
},
"1581": {
"id": 1581,
"title": "American Gothic",
"listingIds": [
1320
]
}
}
book = {
"id": 345,
"title": "Among the Thugs",
"listingIds": [
2065
]
}
来源:https://stackoverflow.com/questions/64002070/rest-operator-for-deleting-property-in-object-not-working-in-react-component