大写输入将光标移动到最后

Question

在React中大写输入标记的内容会使光标移动到文本的末尾 知道如何解决它或如何以另一种方式完成它以避免这个问题？

请查看CodePen Example

class App extends Component {
  state = {
    inputValue: ''
  }

  handleInputchange = (e) => {
    this.setState({ inputValue: this.handleCapitalize(e.target.value) })
  }

  handleCapitalize = (str) => {
    return str.toUpperCase();
  }

  render() {
    return (
      <input onChange={this.handleInputchange} value={this.state.variableName} />
    );
  }
}

Answer 1

这是因为variableName 中的文字在输入后被完全替换。 你可以通过手动使用参考来管理DOM选择来解决这个问题。或者如果项目任务可以使用一些样式来输入你的。

此问题已在github上进行讨论。