React 触发 KeyboardEvent

Question

我有一个 PIN 码字段组件，它只是包装在React.Fragment. 每次按下一个键，它都会聚焦下一个输入。当我到达最后一个输入时，我想触发一个表格来聚焦组件之外的下一个控制器（输入、按钮、链接等）。我尝试发送 a KeyboardEvent，但不起作用：

const evt = new KeyboardEvent("keydown", {
  ...
  code: "Tab",
  key: "Tab",
})

lastInput.dispatchEvent(evt)

任何想法？

源代码： https: //github.com/soywod/react-pin-field
演示：https://react-pin-field.soywod.me/

Answer 1

根据这个答案，浏览器安全模型会阻止您模拟按下 Tab 键。

作为替代方案，您也许可以nextFocusId向组件添加一个属性，并使用它来移动光标document.getElementById().focus()。