Reactjs 如何离开无限的重播？

模糊时，我希望执行blurEvent函数，它会执行，但由于inputRef.current.blur（），它会进入无限循环。但我需要以某种方式摆脱输入焦点。如何解决这个问题

const inputRef = React.useRef(null);
const blurEvent= () => {
  inputRef.current.focus({
    cursor: 'start',
  })
     inputRef.current.blur();
}
<Input
  placeholder="Name"
  required
  ref={inputRef}
  onBlur={blurEvent}
/>

const inputRef=React.useRef（null）；
常量模糊事件=（）=>{
inputRef.current.focus({
光标：“开始”，
})
inputRef.current.blur（）；
}

与useState（）一起使用

const[isFocused，setIsFocused]=useState（false）
const inputRef=React.useRef（null）
常量handleOnBlur=（）=>{
如果（聚焦）{
inputRef.current.focus({
光标：“开始”，
})
inputRef.current.blur（）
}
setIsFocused（错误）
}
setIsFocused（真）}
onBlur={blurEvent}
/>

您可以将该任务分配给两个具有布尔值的事件函数，如下所示

const inputRef = React.useRef(null);
const [isAutoFocused,setIsAutoFocused] = useState(false)
const blurEvent= () => {
  inputRef.current.focus({
    cursor: 'start',
  })
  setIsAutoFocused(true)
}
const focusEvent = () => {
    if (!isAutoFocused){
        return
    }
    inputRef.current.blur();
    setIsAutoFocused(false)
}
<Input
  placeholder="Name"
  required
  ref={inputRef}
  onBlur={blurEvent}
  onFocus={focusEvent}
/>

const inputRef=React.useRef（null）；
常量[isAutoFocused，setIsAutoFocused]=useState（false）
常量模糊事件=（）=>{
inputRef.current.focus({
光标：“开始”，
})
setIsAutoFocused（真）
}
const focusEvent=（）=>{
如果（！isAutoFocused）{
返回
}
inputRef.current.blur（）；
setIsAutoFocused（错误）
}

你到底想在这里完成什么？如果你有一个函数调用它自己，它将是无限的。您可以定义一个由onBlur（）和onFocus（）切换的状态，然后使用该状态来决定如何处理ref。例如：如果您使用的是react的更新版本16或更高版本，则应该使用

createRef（）

而不是

useRef（）

@stiyale我尝试使用useState来处理onBlur和onFocus的状态。添加了useState示例。但它仍然无法解释您试图实现的目标，我们将能够更好地帮助您。也许有更好的方法来做你想做的事情。为了将来的参考，它有助于解释您希望您的代码在og帖子中做什么。@StiyAle我试图在模糊事件之前将光标放在输入的起始位置。此代码不起作用，因为在单击“退出输入无限循环”后，重新开始，通过包装useCallBack钩子来尝试，已经尝试过了，同样的问题

const inputRef = React.useRef(null);
const [isAutoFocused,setIsAutoFocused] = useState(false)
const blurEvent= () => {
  inputRef.current.focus({
    cursor: 'start',
  })
  setIsAutoFocused(true)
}
const focusEvent = () => {
    if (!isAutoFocused){
        return
    }
    inputRef.current.blur();
    setIsAutoFocused(false)
}
<Input
  placeholder="Name"
  required
  ref={inputRef}
  onBlur={blurEvent}
  onFocus={focusEvent}
/>