● 라디오 버튼 요소
라디오 버튼 요소는 <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">