ReactJS和Redux。如何突出显示当前点击的元素？

Question

为了改变状态，我使用redux。我有ChapterList组件，其中我迭代章节列表并显示它，我也有内容组件显示内容本身

在左侧我有主题列表，当我点击其中一个时，该主题的内容显示在右侧。如何使左侧的主题突出显示。

我希望它像这里一样突出显示。

Answer 1

我假设您的主题是一个单独的组件，因此您可以将“isActive”道具传递给它，然后在渲染函数中检查“isActive”道具并添加“活动”类。

Topic组件中的

：

render() {
  const classes = this.props.isActive ? 'topic topic-active' : 'topic';
  return ( 
    <div className={classes} >
  ...