Reactjs 如何在受控输入的最后一个字符后设置插入符号？

我有一个带有受控输入的React组件：

类myComponent扩展组件{
切换焦点（）{
这是我的国家({
hasFocus:！this.state.hasFocus
})
}
componentDidUpdate（）{
if（this.state.hasFocus）{
此.input.setSelectionRange（10001000）
}
}
render（）{
返回(
{this.input=x}}/>
)
}
}

您应该在

设置选择范围之前添加
this.input.focus（）

使用旧的
React.createClass
的方法如下：

var App = React.createClass({
  getInitialState () {
    return {
      hasFocus: true,
      value: 'test'
    };
  },
  toggleFocus: function() {
    this.setState({
      hasFocus: !this.state.hasFocus
    })
  },
  onChange: function(event) {
    this.setState({
      value: event.target.value
    })
  },
  componentDidMount: function() {
    if (this.state.hasFocus) {
      this.setSelectionRange();
    }
  },
  componentDidUpdate: function() {
    if (this.state.hasFocus) {
      this.setSelectionRange();
    }
  },
  setSelectionRange: function() {
      this.input.focus();
      this.input.setSelectionRange(1000,1000);
  },
  render: function() {
    return <input onFocus={this.toggleFocus} onChange={this.onChange} value={this.state.value} ref={x => {this.input = x}}/>;
  }
});

ReactDOM.render(
  <App />,
  document.getElementById('container')
);

var-App=React.createClass({
getInitialState（）{
返回{
hasFocus：没错，
值：“测试”
};
},
toggleFocus:function（）{
这是我的国家({
hasFocus:！this.state.hasFocus
})
},
onChange：函数（事件）{
这是我的国家({
值：event.target.value
})
},
componentDidMount:function（）{
if（this.state.hasFocus）{
此.setSelectionRange（）；
}
},
componentDidUpdate:函数（）{
if（this.state.hasFocus）{
此.setSelectionRange（）；
}
},
setSelectionRange:函数（）{
this.input.focus（）；
此.input.setSelectionRange（10001000）；
},
render:function（）{
返回{this.input=x}}/>；
}
});
ReactDOM.render(
,
document.getElementById（'容器'）
);
@FaureHu很抱歉，url错误。请再次检查示例，看看它是否有效。