[vue3] input checkbox 컴포넌트로 만들기

vue3 composition api의 setup 문법일 때 사용할 수 있는 방법이다.

간단하게 이렇게 부모컴포넌트와 자식컴포넌트를 만들어두고 해봅시다.

부모 컴포넌트 쪽은 이렇게 해두는데, 먼저 자식컴포넌트를 불러와서 v-model로 값을 넘겨줍니다.

이어서 자식컴포넌트 쪽에는 이렇게 입력해주시면 되는데요

부모에서 v-model 로 받은 값이 props의 modelValue로 넘어오게 됩니다.

이후에 input checkbox에서 @input 이벤트가 일어날 때 emit으로 update:modelValue 를 해주고, 값으로 $evnet.target.checked 값을 넘겨주면 정상 작동하게 됩니다.

[vue3] input radio 컴포넌트로 만들기 (0)	2023.01.26

Encrypted