16. 이벤트 처리하기

• 프로젝트 링크

• 이벤트 처리하기

  src/App.tsx

  import TabButton from "./TabButton";
  
  function App() {
    return (
      <section id="examples">
        <h2>Examples</h2>
        <menu>
          <TabButton>Components</TabButton>
        </menu>
      </section>
    );
  }
  

  src/components/TabButton.tsx

  function TabButton({children}) {
    function handleClick() {
      console.log("TabButton clicked!");
    }
  
    return (
      <li>
        <button type="button" onClick={handleClick}>{children}</button>
      </li>
    );
  }
  
  export default TabButton;