[Vue] Checkbox 체크 유무를 특정 값으로 바인딩

 

 

Vue.js에서 체크박스에 바인딩 된 모델의 값은 기본적으로 true / false 이지만 특정 상황에선 다른 문자로 치환이 필요한경우가있다

 

이럴때 체크 유무를 따져서 값을 변경해주는 방법 이외에 input의 true-value와 false-value props를 사용한다.

<input type="checkbox" v-model="AgreeYN" true-value="Y" false-value="N"/>

 

이때 주의할점은 form submit시 체크 되지않은 값은 전송되지 않는다.

 

참고 https://kr.vuejs.org/v2/guide/forms.html#%EC%B2%B4%ED%81%AC%EB%B0%95%EC%8A%A4-1

폼 입력 바인딩 — Vue.js