2

一旦用户在文本字段中输入文本，我尝试了不同的方法来实现 mutator 将文本转换为大写。但还没有成功。埃里克提供的例子似乎是正确的，但也许我遗漏了一些东西。

/** Converts a form value to uppercase **/
const upper = ([name], state, { changeValue }) => {
  changeValue(state, name, (value) => value.toUpperCase())
}


<Form
  onSubmit={onSubmit}
  mutators={{
    ...arrayMutators,
    upper
  }}
  render={({
    handleSubmit,
    mutators: { push, pop, upper }, // injected from final-form-arrays above
    pristine,
    reset,
    submitting,
    values
  }) => {
    return (
      <form onSubmit={handleSubmit}>
        <div>
          <label>Company</label>
          <Field name="company" component="input" onChange={(e) => upper('company')} />
        </div>
      </form>
    )}
  }
/>

调用未定义toUpperCase的值时会引发错误。value非常感谢任何帮助！

更新：2018 年 10 月 27 日

我意识到我们也可以使用解析器来解决这个问题：

upper = value => {
  return value ? value.toUpperCase() : ''
}


<Field name="company" component="input" parse={this.upper} />

仍在寻找 mutator 如何工作以及我的代码中的错误是什么。

已尝试： 根据现有字段改变状态

如何从外部用户操作中设置/更改字段值

4

1 回答 1

1

据我所知，react-final-form 您可以直接获取此数据我会建议您可以使用此代码 onChange={(event, value) => input.onChange(value.toUpperCase())}

https://codesandbox.io/s/0x9y71nwyp

于 2018-10-23T14:03:21.590 回答