如何在没有无限循环的情况下在 React 的 useEffect 钩子中使用 window.open()?

IT技术 reactjs typescript redux react-redux react-hooks
2021-05-03 17:34:35

我是 React、Redux 和 Typescript 的新手。我想等记载实现SSO和OAuth这里我可以使用登录按钮完成此操作,因此单击后,它会重定向到我的应用程序(如果参数正确)。但是,我希望在打开页面时自动启动该过程。(没有任何额外的按钮)。我假设我可以使用useEffect这是我的代码,但它创建了一个无限循环。在这里删除无限循环的正确方法是什么?

export function Auth() {
    useEffect(() => {
       window.open(getAuthorizeHref(), "_self");
        
    }, []);

    return <div />;
}
1个回答

诀窍是 useEffect 需要第二个参数
请试试下面的例子

useEffect(() => {
    window.open(getAuthorizeHref(), "_self");
}, []);

第二个参数是一个变量数组,组件将检查这些变量以确保在重新渲染之前已更改。你可以在这里放任何你想要的props和状态来检查。 在此处输入图片说明