有条件地呈现DataSearch组件

Question

我已经使用ReactiveSearch组件构建了一个搜索ui，效果很好！现在，我试图根据显示的路线/视图来确定如何有条件显示导航栏中的DataSearch component。

例如在我的主页上。我在超大型飞行器中有一个很大的DataSearch组件搜索表单，不需要/也不需要在导航栏中显示的DataSearch组件。

我看过this和this，但不确定如何在ReactiveSearch的DataSearch组件的上下文中实现它们。

更新：

所以我一直在研究如何从React Router（v4）抓取网址，看来我可以通过以下操作获取它：

componentWillReceiveProps(nextProps) {
                if (nextProps.location !== this.props.location) {
...

所以我以为我可以使用location !== '/' && DataSearch之类的东西，但这不起作用。

Answer 1

您尝试过其中任何一项吗？

{condition && <DataSearchComponent/>}

或

{condition ? <DataSearchComponent/> : <OtherComponent/>}