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

안녕하세요! 강의 실습 도중 설정 방식과 관련하여 궁금한 점이 생겨 질문 드립니다.

강의에서는 argTypes 안에 onClick: { action: 'clicked' }를 추가하셨는데, 제가 사용 중인 Storybook 10 버전에서는 argTypes 작성 시 action이라는 키 자체가 자동 완성(타입 추론)에 나타나지 않습니다.

이와 관련하여 두 가지가 궁금합니다.

1. 타입 추론 문제: argTypes에서 action 키가 뜨지 않는 것이 Storybook 버전이 올라가면서 바뀐 방식인가요? 아니면 제가 별도의 설정을 놓치고 있는 것인가요?

2. 설정 방식의 차이: 현재 강의에서는 아래 두 가지를 모두 사용하셨습니다.

   • argTypes: { onClick: { action: 'clicked' } }

   • args: { onClick: fn() }

   만약 저처럼 argTypes에서 action 키가 제대로 인식되지 않는 상황이라면, args에 fn()만 작성해도 강의 내용처럼 액션 로그를 확인하는 데 문제가 없는 것인지 궁금합니다.

3. action: 'clicked'를 사용하는 이유: 단순히 이벤트를 연결하는 것 외에 action이라는 키를 통해 'clicked'라는 라벨을 따로 지정해주시는 특별한 이유가 있으신가요?

버전 차이 때문인지 제가 타입을 잘못 다루고 있는 것인지 몰라 질문 남깁니다. 답변 부탁드립니다!