Hey guys, switching old code over to React Hooks and having an issue on the PUT request. Here is the old code that worked when editing:
editArt = async (id, title, year, medium, url) => {
const artBody = {
title: title,
year: year,
medium: medium,
poster: url
}
let newList = this.state.artList.slice()
let indexToEdit = newList.findIndex(art => art.id === +id)
let response = await fetch(`${API}/mysite/${id}`, {
method: "PUT",
mode: "cors",
body: JSON.stringify(artBody),
headers: {
"Accept": "application/JSON",
"Content-Type": "application/json",
"token": this.state.token
},
})
if (response.status !== 200) {
alert(`Couldn't edit this masterpiece.`)
}
newList.splice(indexToEdit, 1, {id, ...artBody})
this.setState({
artList: newList
})
}
However, when I switched it over to use Hooks logic, it now edits the index before it? Any idea??
const editArt = async (id, title, year, medium, url) => {
const artBody = {
title: title,
year: year,
medium: medium,
poster: url
}
let newList = artList.slice()
let indexToEdit = newList.findIndex(art => art.id === +id)
let response = await fetch(`${API}/mysite/${id}`, {
method: "PUT",
mode: "cors",
body: JSON.stringify(artBody),
headers: {
"Accept": "application/JSON",
"Content-Type": "application/json",
"token": token
},
})
if (response.status !== 200) {
alert(`Unable to edit this masterpiece!`)
} else {
alert(`Edited this masterpiece!`)
}
newList.splice(indexToEdit, 1, {id, ...artBody})
setArtList(newList)
}