● 라디오 버튼 요소

라디오 버튼 요소는 <input> 태그의 type 속성 값을 radio로 지정하면 만들 수 있습니다. 라디오 버튼 요소는 체크박스 요소와 다르게 1개만 선택할 수 있습니다. 그래서 v-model 디렉티브로 바인딩할 데이터 속성의 값이 value 속성의 값과 일치하면 체크 표시된 상태로 렌더링됩니다.

radio/src/App.vue

<script>
export default {
  data() {
    return {

      gender: 'male',

    };
  },
  methods: {
    printData() {

      console.log(this.gender); // 선택된 입력 요소의 value 속성 값 출력

    },
  },
}
</script>
<template>
  <form id="loginForm">