Redux Form - 将当前输入值作为字符串返回 onChange

Question

当我的输入包含至少 1 个字符以将必填字段显示为有效时，我试图在它的旁边显示一个“勾号”。我遇到的问题是，目前当我console.log(textEntered)每次字段更改时，我都会收到一个包含所有键入字母而不是完整字符串的对象。例如，如果我输入“你好”，日志看起来是这样的（忽略未定义的）：

这是我的 Redux 字段组件：

handleInput = (textEntered) => {
  console.log(textEntered);
  this.setState({ textEntered }, () => {
    if (this.state.textEntered.length) {
      this.setState({ completed: true });
    } else {
      this.setState({ completed: false });
    }
  });
}

render() {
  return (
    <Field
      name={this.props.placeholderText}
      component={TextInput}
      onChange={this.handleInput}
    />
  );
}

const TextInput = (field) => {
  return (
    <div className="drill-creation-input">
      <input
        {...field.input}
        type="input"
        onChange={e => field.input.onChange(e.target.value)}
      />

      <label htmlFor={field.input.name}>
        <span>{field.input.name}</span>
      </label>
    </div>
  );
};

Answer 1

OnChange 处理程序具有以下签名（请参阅文档）

onChange : (event, newValue, previousValue)

所以要读取完整的值，只需定义你的handleInput喜欢：

handleInput = (evnt, textEntered) => {
  console.log(textEntered);
  ...
}