在ReactJS中使用BaseWeb的FormControl Input时获取email、password值为undefined

问题根因 #

你的输入值获取写法错误：事件对象的target属性上不存在email、password字段，输入内容存储在target.value中，所以你一直取不到对应值。

修复方案 #

替换以下两个onChange回调函数的代码即可：

// 邮箱输入回调修改后
const onChangeEmail = ({ target: { value } }) => {
  setIsValid(validateEmail(value));
  setEmail(value);
};

// 密码输入回调修改后
const onChangePassword = ({ target: { value } }) => {
  setIsValid(true);
  setPassword(value);
}

优化建议 #

你当前的isValid状态同时管控邮箱、密码两个输入框的错误提示，只要一个输入不合法就会同时触发两个框的错误样式，建议拆分出独立的邮箱校验状态、密码校验状态，交互体验会更合理。

内容的提问来源于stack exchange，提问作者ayyagarian