首页 > 解决方案 > 在 render() 之前使用什么组件生命周期来做某事?

问题描述

我需要检查某些道具(来自 redux 商店)是否为空对象。如果它是空的,我希望页面重定向到另一个页面,而不是打扰调用render().

当前流程类似于:

constructor(props) {
   this.checkObject();
}

checkObject() {
  if (Object.keys(someObj).length === 0 && someObj.constructor === Object) {
    this.props.history.push("/some-other-route");
  }
}

render() {
   // some code
}

但是,当我执行 , 时console.logrender()导致checkObject()一些错误,因为render()需要一个非空对象才能正确显示内容。这就是我不想render()在对象为空(我通过检查checkObject())时甚至调用时做出反应并且只是重定向到另一个页面的原因。

那么是否有一种生命周期方法可以在调用之前执行我的重定向代码render()

标签: javascriptreactjsreact-router

解决方案


您可以在渲染中使用 react-router 的 Redirect 组件。

import { Redirect } from 'react-router'
render(){

 (checkIfObjectEmpty)?<Redirect to = '/some_route'/>:<JSX>

}

推荐阅读