17. 함수를 Prop(속성)의 값으로 전달하기

• 프로젝트 링크

• 함수를 Prop(속성)의 값으로 전달하기

  src/App.tsx

  import TabButton from "./TabButton";
  
  function App() {
    function handleSelect() {
      console.log("TabButton selected!");
    }
  
    return (
      <section id="examples">
        <h2>Examples</h2>
        <menu>
          <TabButton onSelect={handleSelect}>Components</TabButton>
          <TabButton onSelect={handleSelect}>JSX</TabButton>
          <TabButton onSelect={handleSelect}>Props</TabButton>
          <TabButton onSelect={handleSelect}>State</TabButton>
        </menu>
        Dynamic Content
      </section>
    );
  }
  

  src/components/TabButton.tsx

  function TabButton({children, onSelect}) {
    return (
      <li>
        <button type="button" onClick={onSelect}>{children}</button>
      </li>
    );
  }
  
  export default TabButton;