기존의 자바스크립트처럼 코드를 처리하였는데, 리액트를 이용해서 처리할려면 어떻게 하면 좋을지 알고싶습니다.
<div style="color: #c5c8c6; background-color: #111111; font-family: Menlo, Monaco, 'Courier New', monospace; font-size: 16px; line-height: 24px; white-space: pre;">
<div>&lt;div className="btn-box"&gt;</div>
<div> &lt;button onClick={(e) =&gt; {this.prsStart('scissors', e)}}&gt;가위&lt;/button&gt;</div>
<div> &lt;button onClick={(e) =&gt; {this.prsStart('rock', e)}}&gt;바위&lt;/button&gt;</div>
<div> &lt;button onClick={(e) =&gt; {this.prsStart('paper', e)}}&gt;보&lt;/button&gt;</div>
<div>&lt;/div&gt;</div>
<div>
<div style="line-height: 24px;">const eventTarget = e.currentTarget;</div>
<div style="line-height: 24px;">
<div style="line-height: 24px;">eventTarget.classList.add('on');</div>
</div>
</div>
<div></div>
</div>

style={{ color: 'red' }} 이런 인라인 스타일로 하셔도 되고, className으로 css랑 연결하셔도 됩니다.

인프런 커뮤니티 질문&답변

클릭한 버튼에 스타일을 줄려면 어떻게 하는게 좋을까요?