只要输入节点已挂载并且存在对它的引用，就可以对照document.activeElement进行检查：

const searchInput = React.useRef(null)

if (document.activeElement === searchInput.current) {
  // do something
}

return <input type="text" ref={searchInput} />

另一种方法是在输入字段中添加focus和blur事件的事件侦听器：

const [focused, setFocused] = React.useState(false)
const onFocus = () => setFocused(true)
const onBlur = () => setFocused(false)

return <input type="text" onFocus={onFocus} onBlur={onBlur} />

请注意，每次聚焦或模糊节点时，都会调用重新渲染（但这正是您想要的，对吗？）

我从大卫给出的答案开始，他描述了两种方法，这两种方法对我都有效，但我对这两种方法都有顾虑：
1.在第一种情况下，它使用findDOMNode，这有一些缺点：至少不鼓励使用它，并且它可以以被认为是反模式的方式容易地实现;而且它还可以通过绕过虚拟DOM而直接使用DOM来使代码变慢。
1.在第二种选择中，创建和管理组件状态，却发现答案似乎工作量太大，很容易失去同步，并可能导致组件不必要地重新呈现。
因此，在尝试进一步探讨这个问题后，我提出了以下解决方案：

if (this.props.id === document.activeElement.id) {
  // your code goes here
}

同样的评论也适用于大卫的回答：
但不应在render方法中执行此操作，因为输入节点可能尚未挂载。请使用类似componentDidUpdate或componentDidMount的生命周期方法。
优点：

• 使用当前零部件特性（不可变的值）
• 不需要状态管理，因此不会导致不必要的重新渲染
• 不需要DOM遍历，因此性能应该尽可能好
• 不需要创建组件引用

要求：

• 您的组件应该有一个id属性，该属性被传递到您要检查的表单元素（无论如何，这是最有可能的情况）

使用钩子：
首先，创建并初始化Reference

const yourElement = useRef(null)

然后用刚刚创建的引用标记元素：

<div ref={yourElement}>Im an DOM node</div>

然后，在需要比较document.activeElement文档属性是否等于所引用的DOM节点时使用此逻辑

yourElement.current === document.activeElement

有更容易的方法与钩。
进行导入

import React, {useState} from "react";

定义

const [isMyInputFocused, setIsMyInputFocused] = useState(false);

在您选择的输入中添加

onBlur={() => setIsMyInputFocused(false)}
                    onFocus={() => setIsMyInputFocused(true)}

从现在起，您可以随心所欲地访问isMyInputFocused。

使用功能组件可以确定当前输入是否具有焦点：

import React from "react";

export default function App() {
  const ref = React.createRef(null);

  const handleMouseOut = (currentRef) => {

    if (document.activeElement === currentRef) {
      console.log("Yesss");
    }
  };
  return (
    <div className="App">
      <input
        type="text"
        ref={ref}
        onMouseOut={() => handleMouseOut(ref.current)}
      />
    </div>
  );
}

示例：https://codesandbox.io/s/reverent-allen-0qr8u

根据您想要做的事情，您可以使用onFocus（React 17）或onBlur（React 16）来实现您想要的功能。

***调整@Abhishek E H的答案，如果你使用onMouseOut，会有一点延迟，但是使用onFocus效果很好。谢谢你的启发。

import React from "react";

 export default function App() {
   const ref = React.createRef(null);

   const handleMouseOut = (currentRef) => {

if (document.activeElement === currentRef) {
  console.log("Yess");
   }
 };
return (
<div className="App">
  <input
    type="text"
    ref={ref}
    onFocus={() => handleMouseOut(ref.current)}
  />
</div>

）;}