发布开关输入布尔值 (React/Typescript)
Posting Switch Input Boolean Value (React/Typescript)
我正在尝试 post 开关输入切换控件的状态值,但是当我使用按钮发送 post 请求函数 submitRecommendation()
时,我得到JSON parse error: Cannot deserialize instance of `boolean` out of START_OBJECT token; nested exception
错误。
我在这里做错了什么?有没有一种方法可以将此函数编写为具有多个切换控件,而无需重复代码?
interface IState {
mentorInfoComplete?: boolean;
hasChanged?: boolean;
}
class Component extends React.Component<Props, State> {
public state: State = {
mentorInfoComplete: false
}
public render() {
const {} = this.props;
const { mentorInfoComplete } = this.state;
const {} = this;
<div className={classes.switchContainer}>
<FormGroup row>
<FormControlLabel
control={
<Switch
checked={mentorInfoComplete}
onChange={this.handleChange}
value={mentorInfoComplete}
>Toggle</Switch>
}label="YES"
/>
<Typography color="secondary" variant="body1" className={classes.toggleQuestions}>Is this question complete</Typography>
</FormGroup>
</div>
<Button
color="primary"
className="reviewApplication-back"
variant="contained"
type="submit"
onClick={this.submitRecommendation}>
Recommend Approval
</Button>
private handleChange() {
this.setState({
mentorInfoComplete: true
});
console.log(this.state);
}
private async submitRecommendation() {
const {
application,
mentorInfoComplete
} = this.state;
if (!application) {
return;
}
try {
await axios.post(
`/mentorApplication/${match.params.applicationId}/checklist`,
{
mentorInfoComplete: { mentorInfoComplete }
}
);
}
}
不知道 API,我猜这是有问题的行:
mentorInfoComplete: { mentorInfoComplete }
你基本上做到了
mentorInfoComplete: { true }
当我在猜测你想要的东西时
mentorInfoComplete: true
尝试去掉多余的括号,看看是否有帮助?
我正在尝试 post 开关输入切换控件的状态值,但是当我使用按钮发送 post 请求函数 submitRecommendation()
时,我得到JSON parse error: Cannot deserialize instance of `boolean` out of START_OBJECT token; nested exception
错误。
我在这里做错了什么?有没有一种方法可以将此函数编写为具有多个切换控件,而无需重复代码?
interface IState {
mentorInfoComplete?: boolean;
hasChanged?: boolean;
}
class Component extends React.Component<Props, State> {
public state: State = {
mentorInfoComplete: false
}
public render() {
const {} = this.props;
const { mentorInfoComplete } = this.state;
const {} = this;
<div className={classes.switchContainer}>
<FormGroup row>
<FormControlLabel
control={
<Switch
checked={mentorInfoComplete}
onChange={this.handleChange}
value={mentorInfoComplete}
>Toggle</Switch>
}label="YES"
/>
<Typography color="secondary" variant="body1" className={classes.toggleQuestions}>Is this question complete</Typography>
</FormGroup>
</div>
<Button
color="primary"
className="reviewApplication-back"
variant="contained"
type="submit"
onClick={this.submitRecommendation}>
Recommend Approval
</Button>
private handleChange() {
this.setState({
mentorInfoComplete: true
});
console.log(this.state);
}
private async submitRecommendation() {
const {
application,
mentorInfoComplete
} = this.state;
if (!application) {
return;
}
try {
await axios.post(
`/mentorApplication/${match.params.applicationId}/checklist`,
{
mentorInfoComplete: { mentorInfoComplete }
}
);
}
}
不知道 API,我猜这是有问题的行:
mentorInfoComplete: { mentorInfoComplete }
你基本上做到了
mentorInfoComplete: { true }
当我在猜测你想要的东西时
mentorInfoComplete: true
尝试去掉多余的括号,看看是否有帮助?