反应输入-光标跳到末尾

Question

我用的是这个包react-phone-number-input

上下文

我有这个电话号码字段

<InputPhone
        {...input}
        value={input.value || ''}
        placeholder={intl.formatMessage(
          placeholder ? messages[placeholder] : messages.placeholder,
        )}
        style={{
          borderColor: meta && meta.touched && meta.error && 'red',
        }}
        tabIndex={index}
        size={size}
      />

这是在一个功能组件中，我不能使用另一个textInput，因为我们在多个表单中使用这个小组件，加上它里面有特殊的功能，比如样式和占位符。

问题

问题与这个包react-phone-number-input有关:如果我试图编辑第一和第二部分中的一个数字，插入符号会跳转到末尾。

有人知道如何修复它，因为SmartCaret的react-phone-number-input函数已经被禁用了。

Answer 1

看看这个问题 --听起来像是你的问题。

您可以尝试聪明卡雷特特性，这是docs页面上的最后一项。请记住，它在某些Android设备上可能存在限制。

import SmartInput from 'react-phone-number-input/smart-input'

<PhoneInput
    inputComponent={ SmartInput }
    placeholder="Enter phone number"
    value={ this.state.value }
    onChange={ value => this.setState({ value }) }/>

希望能帮上忙！

如果这不起作用，一个最小的，可重复的例子将是有帮助的，就像杜波卡斯建议的那样。