我已经能够在数据库中更改复选框的activation status
事件。现在我无法切换复选框的状态,这里缺少什么?
我在各个网站上都找过,但找不到解决办法。
这是我打印公司的代码。
{this.state.allCompanies.map(com => (
<tr>
<td>{com.cname} </td>
<td>
<a>
<input
type="checkbox"
name="active"
checked={com.is_active == 1 ? "true" : ""}
onClick={
(() => {
this.setState({ cked: !this.state.cked });
},
e => this.handleActivated(e, com.cid))
}
/>
</a>
</td>
</tr>
))}
这是我的功能。
handleActivated(e, id) {
const comid = id;
var data = {
comid: id
};
console.log(data);
fetch("http://localhost:5000/edit/company", {
method: "POST",
headers: {
Accept: "application/json, text/plain, */*",
"Content-Type": "application/json"
},
body: JSON.stringify(data)
})
.then(function(response) {
if (response.status >= 400) {
throw new Error("Bad Response from server");
}
return response.json();
})
.then(function(data) {
console.log(data);
if (data === "success") {
// e.target.checked : !e.target.checked;
this.setState({ msg: "Company Edited", active: !e.target.checked });
}
})
.catch(function(err) {
console.log(err);
});
// this.setState({ });
}
最佳答案
您正在将两个函数传递给onClick,据我所知(尽管我无法为此提供源代码或告诉您原因),react将只使用您给props的最后一个值。这就是为什么设置cked
的状态可能不起作用。
我建议只给它一个这样的函数:
onClick={
(e) => {
this.setState({ cked: !this.state.cked });
this.handleActivated(e, com.cid)
}
}
如果只想在完成
setState
之后执行第二个(因为它是异步的),那么应该使用setState
的回调函数。
onClick={
(e) => {
this.setState({ cked: !this.state.cked }, () => {
this.handleActivated(e, com.cid)
});
}
}
关于mysql - 如何在此处更改复选框的状态?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/56543459/