从其他组件的事件创建组件

Question

我对React很新，我在理解组件的生命周期方面遇到了一些麻烦。

我目前有一个导航栏和导航按钮组件，我希望每个导航按钮触发不同的东西。我不想更改页面，我想在同一页面中显示更多组件。

我已经设置了按钮，因此我可以执行以下操作。

<NavButton text="Searches" onClick={
    function () {
        console.log('test');
    }
} />
</div>

在那个事件中我是否可以说，在我的DOM中的其他地方创建/显示不同的组件？

Answer 1

你可以：

• 给出你的组件状态，并添加一个showdetail标志（在getInitialState()中设置为false）
• 点击更新状态（setState({showDetail: true})）
• 渲染依赖于状态

渲染可能如下所示：

render() {
  return (
    <NavItem props={foo}>
      {this.state.showDetail? <NavSubItem props={bar}/> : null }
    </NavItem>
  )
}

这样，只有showDetail == true才会呈现<NavSubItem>。