javascript - 将事件类添加到所选项目 react

Question

我制作了一个 React 父组件，如果用户单击两个选项之一，则会呈现不同的子组件。

根据选择的选项，我想添加一个 active 类。

请参阅下面的代码。

我已经采取了很多方法，但由于我无法弄明白，所以将它们剥离了。

class Test extends Component {

    constructor(props) {
        super(props);

        this.state = {
            currentView: 'one'
        };

        this.showOne = this.showOne.bind(this);
        this.showTwo = this.showTwo.bind(this);
    }

    showOne() {
        this.setState({
            currentView: 'one'
        });
    }

    showTwo() {
        this.setState({
            currentView: 'two'
        });
    }

    render(){
    ......
        <p className="one" onClick={this.showOne}>One</p>
        <p className="two" onClick={this.showTwo}>Two</p>
    ......
    }
}

Answer 1

你在找这样的东西吗？

<p className={this.state.currentView === 'one' ? 'one active' : 'one'} onClick={this.showOne}>One</p>
<p className={this.state.currentView === 'two' ? 'two active' : 'two'} onClick={this.showTwo}>Two</p>