● 함수 내부에서의 구조 분해 할당
구조 분해 할당을 꼭 매개변수에서 하지 않아도 됩니다. props를 그대로 받아 함수 내부에서 분해해도 같은 효과를 얻을 수 있습니다.
src/components/User.tsx
export default function User(props: {
userObj: { name: string; age: number; };
clickHandler: () => void;
}) {
const {
userObj: { name, age },
clickHandler,
} = props;
return (
<>
<p>name: {name}</p>
<p>age: {age}</p>
<button onClick={clickHandler}>클릭</button>
</>
);
}