单击特定选项卡时如何显示React.js中的选项卡内容？

Question

我真的是React.js的新手，我遇到了与标签显示内容有关的问题。

单击下面代码中的特定标签时，如何显示标签的内容？

用户点击标签后，我需要显示内容。

class Tabs extends PureComponent {
    constructor(props) {
        super(props);
        this.state = { 
            home: false,
            post: false
         }
    }


    handleChangeTab = event => {
        let tabName = (event.target.getAttribute("name"));
        let initialState = {
          home: false,
          post: false
        };

        this.setState({
          ...initialState,
          [tabName]: true
        });
      };
    render() { 
        return ( 
            <div>

            <div className="containerSearch">

            <h1>Display Tab COntent</h1>

            <ul className="tabsResultsTabs">

                   <li 
                   onClick={this.handleChangeTab}
                    className={this.state.home ? "active" ? null}
                    name="home"
                    >Home</li>

                   <li 
                   onClick={this.handleChangeTab} 
                   className={this.state.post ? "active" : null}
                   name="post"
                   >post</li>


            </ul>
            <div>
              <h2>home content</h2>
            </div>
            <div>
              <h2>post content</h2>
            </div>
             </div>
            </div>
         );
    }
}