我有一个JS网站.每当我的标签出现焦点或被隐藏时,我想得到一个回调.我发现了这个页面的可见性API,但我不知道如何在ReactJS中使用它.

我应该在哪个生命周期方法中为此注册回调?

推荐答案

这应该是有效的:

componentDidMount() {
    window.addEventListener("focus", this.onFocus)
}

componentWillUnmount() {
    window.removeEventListener("focus", this.onFocus)
}

onFocus = () => {
    //
}

编辑:同样适用于"模糊",它应该适用于标签隐藏时.

查看@Assaf的答案,了解如何使用钩子.

Reactjs相关问答推荐

客户端组件中服务器组件的两难境地

在Reaction+Redux+RTKQuery中对API调用进行排序

单击空白区域时,Reaction Multiple下拉组件不关闭

在构建或部署Reaction应用程序时出错

使用自动播放的视频组件呈现登录页面时出现JEST测试错误

更改点几何体的坐标会将其隐藏

shadcn输入+窗体+Zod;一个部件正在改变要被控制的不受控制的输入;

tRPC/react-query,在所有查询完成之前,组件不会收到任何 useQuery 的结果

如何将 MUI X 数据网格单元格方向更改为行级而不是列级?

是否可以直接在 jsx 标签上使用 CSS 定义的 colored颜色 ?

ReactJS on AWS Amplify与EC2上的Spring boot服务之间的混合内容错误

Firebase查询返回随机用户数据,而不是过滤后的用户数据

无法设置 null 的属性(设置src)

如何让 useEffect 在 React.JS 中只运行一次?

在 React 中使用复选框管理状态

ReactJS 动态禁用按钮

React Native - 身份验证 - 触发值以更改 Auth 和 UnAuth 堆栈导航器

仅在重新渲染后设置状态

如何在 React x 中返回组件?

如何判断对话框组件是否位于对话框之上?