Javascript 更改构造函数中的“window.location”在重定向之前仍将首先呈现组件

组件需要检查cookie，如果它经过身份验证，那么组件将被呈现，否则它将使用下面的代码将页面重定向到外部URL。我在组件构造函数方法中更改URL

window.location = '/external-location'

---

但是，组件将首先呈现，然后页面被重定向到外部路径。有没有办法避免组件的初始呈现？

您可以使用

componetWillMount

。然后，您可以设置一个标志并检查该标志，以停止组件在

渲染

功能中的渲染。

您有一个

状态

使用它
我们可以在第一次调用

render

时将“Nothing”（

null

）呈现给

DOM

。
在构造函数中，您可以检查您的条件并将其存储在

状态

中，这当然会影响第一次渲染。
然后在

componentDidMount

上检查是否需要重定向和更新

状态（如果需要）

下面是两个代码相同的示例，当然，只有
shouldRedirect
的初始值发生了更改

应呈现页面示例：


类应用程序扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
shouldRender:false，
shouldRedirect:false//检查你的coockie
};
}
componentDidMount（）{
const{shouldRedirect}=this.state；
如果（应该重定向）{
window.location=”https://google.com/";
}否则{
this.setState（{shouldRender:true}）；
}
}
render（）{
const{shouldRender}=this.state；
返回shouldRender&&I'm render！；
}
}
ReactDOM.render（，document.getElementById（'root'））

尝试在组件构造函数中抛出（window.location='/401or403'）
这是正确的方法吗？对我来说似乎是一种黑客行为。停止组件渲染通常是在
render
函数中完成的。如果您遵循容器和表示组件模式，这正是在数据可用之前停止安装表示组件的方式。检查是否需要重定向最好在
componentWillMount
中完成，而不是在构造函数中完成，但是，如果要使用标志，也可以在
componentDidMount
中完成。因为在我的例子中，逻辑稍微复杂一些。呈现的组件实际上不是包含重定向（外部URL）代码的组件，而是负责另一个应用程序内保护/检查的另一个组件。@squgeim如果你是错误的和误导性的，你不应该使用
组件willmount
而不是
构造函数
，相反。阅读react文档，建议不要使用它，而是使用
构造函数
：@Sag1v因为检查重定向是同步的，所以可以在
componentWillMount
中设置组件是否呈现的标志。该标志甚至不需要是一个状态，因为检查是同步的。关于在哪里使用
构造函数
或
组件将挂载
，存在一些争论，但我同意你的看法。这是另一种黑客行为吗？似乎你想从组件挂载阶段完全跳过“render（）”，而官方文档没有提到这样做的方法，所以你可以称之为黑客行为。顺便说一下，
窗口。位置
没有阻塞。