如何在不刷新应用程序的情况下返回 PUT 请求的结果?

Question

我做了一个PUT请求来切换图像，但要查看它的结果，我必须刷新应用程序。如何在不刷新的情况下做到这一点？

代码：

const Islbutton = props => {
const [islIsOn, setIslIsOn] = useState(props.IslIsOn);
const changeButtonStateIsl = () => {
if (checkRole(role)) {
axios
.put("http://localhost:5000/api/bns/" + bnsName, {
headers: {
Accept: "application/json",
"Content-Type": "application/json"
},
islIsOn: !islIsOn
})
.then(response => {
console.log(response);
})
.catch(error => {
console.log(error);
})
.finally(); // I assume it has to be here?
}
};
return (
<div>
<img
src={islIsOn ? islon : isloff}
onClick={() => changeButtonStateIsl()}
/>
</div>
);
};

如果那是 SQL，我会做这样的事情：选择 *，其中 IslIsOn = 值;

Answer 1

看起来您只需要更改状态即可触发重新渲染。

.then(response => {
// Set the state to true or false based on your response
...
setIslIsOn(true);
})

如果即使从 PUT 收到错误也要触发更改，则可以改为在"最后"部分中设置状态。