在表单提交前,应该确保使用setState更新状态,以便表单提交处理程序可以使用最新的值。示例如下:
class MyForm extends React.Component {
constructor(props) {
super(props);
this.state = {
name: "",
age: 0
};
}
handleInputChange = event => {
const target = event.target;
const value = target.value;
const name = target.name;
this.setState({
[name]: value
});
};
handleSubmit = event => {
event.preventDefault(); // 防止表单提交后页面刷新
console.log("提交的姓名为:", this.state.name);
console.log("提交的年龄为:", this.state.age);
// 在此处使用state中的最新值进行提交处理
};
render() {
return (
);
}
}
在上述示例中,当input的值发生改变时,handleInputChange函数会使用setState更新状态值。而在handleSubmit函数中,会使用最新的state值进行提交处理。
上一篇:表单提交触发器的脚本工作不正常。
下一篇:表单提交错误条目后的更新按钮