그림 3-32 복수 체크박스 요소 실행결과

또한, v-model 디렉티브로 양방향 데이터 바인딩되므로 value 속성의 값을 데이터 속성 배열의 값으로 추가하거나 삭제할 수 있습니다. 개발자 도구(F12)를 열고 체크박스 요소의 체크 상태를 변경한 후 [확인] 버튼을 눌러보세요. fruits 데이터 속성 배열을 확인하면 체크한 요소의 값만 출력됩니다.

그림 3-33 value 속성의 값을 삭제한 결과