input组件的onChange事件在中文输入法下莫名触发多次

66 阅读1分钟

问题描述

目前公司项目遇到了一些中文输入法下输入数字会变成两个,使用 Ant Design 不知道几的版本,仅在 Input.TextArea 的条件下会出现这个问题,使用 Input 输入正常

解决方案

使用自己定义的 currentValue 来作为中间桥梁,充当页面展示的介质以及向上传递的功能

constructor(props){
  super(props)
  this.state = {
    currentValue: props.value
  }
}

render() {
  ...
  const { currentValue } = this.state
  <Input.TextArea
      value={currentValue}
      disabled={disabled}
      autosize={{ true }}
      maxLength="1000"
      placeholder={(
        <createInputPlaceholder
          type={ARGUMENT_TEXT}
          argument={{ type: type }}
        />
      )}
      onChange={(e) => {
        onChange(e.target.value)
        this.setState({ currentValue: e.target.value })
      }}
  />
}