Пример OTP.
ожидаемое поведение: курсор перейдет к следующему вводу и скопирует следующее число, это работает в моем браузере, но в ios с функцией «из сообщения» скопируйте все числа в первом вводе
это код
Код: Выделить всё
const handlePaste = (e: React.ClipboardEvent) => {
e.preventDefault()
const matchNotOtpTypeValues =
otpType === 'numeric' ? /[^0-9]/gi : /[^0-9a-zA-Z]/gi
const pasteValue = e.clipboardData
.getData('text')
.replace(matchNotOtpTypeValues, '')
if (
pasteValue.length < 1 ||
pasteValue.length > otpLength ||
!checkOtp(pasteValue)
)
return
const individualValues = pasteValue.split('')
if (pasteValue.length === 1) {
setOptValues({ ...otpValues, [e.currentTarget.name]: pasteValue })
return
}
const newObj: Record = { ...otpValues }
individualValues.forEach((value, index) => {
newObj[`${name}-${index}`] = value
})
setOptValues(newObj)
const isComplete = pasteValue.length === otpLength
setIsReadyToSubmit(isComplete)
if (isComplete) {
e.currentTarget.blur()
} else {
const nextInput = document.querySelector(
`input[name=${name}-${pasteValue.length}]`
) as HTMLInputElement | null
if (nextInput) {
nextInput.focus()
}
}
}Подробнее здесь: https://stackoverflow.com/questions/793 ... in-ios-web