Reactでイベントリスナーを選択して追加する

Question

このJSを何かに変換する最も良い方法は何ですか？私は最初のReactプロジェクトを作成しています。

おかげ

document.querySelector('.nav').addEventListener('click', e => { 
e.target.classList.toggle('visible'); 
}); 

Answer 1

は、対話型のthis exampleがコンポーネントに反応チェックしてください。

状態を追跡するコンポーネント（つまり、visibleであるかどうか）を作成し、入力を処理してその状態を更新します。

class Square extends React.Component { 
    constructor() { 
    super(); 
    this.state = { 
     value: null, 
    }; 
    } 

    render() { 
    return (
     <button className="square" onClick={() => this.setState({value: 'X'})}> 
     {this.state.value} 
     </button> 
    ); 
    } 
}