[Vue.js] select を使用するときに文字列ではなくブール値を返す方法

bool とバインディングする場合、チェックボックスを使用する場合が多いのかもしれませんが、セレクトボックスを使う方法です。 <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX9yUV52WRN9-XEPzRIaB1g6slT3APlWliZBXv_tOJMM8WL0YtHyBioCAtZ8r-T_wb2DyhCFoPQHFn-OwIBdQu1mMs0ZX1W1EcPckob5VioW7GbhZ_yYVJaUl3z0oOrWjZHdcDQwVb6hA/s1600/vuejs.png" imageanchor="1" hidden><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX9yUV52WRN9-XEPzRIaB1g6slT3APlWliZBXv_tOJMM8WL0YtHyBioCAtZ8r-T_wb2DyhCFoPQHFn-OwIBdQu1mMs0ZX1W1EcPckob5VioW7GbhZ_yYVJaUl3z0oOrWjZHdcDQwVb6hA/s200/vuejs.png" width="200" height="200" data-original-width="400" data-original-height="400" /></a> ```html <div id='app'> <select v-model="boolean" v-on:change='print'> <option v-bind:value='true'>Yes</option> <option v-bind:value='false'>No</option> </select></div>``` ```js new Vue({ el: '#app', data: { boolean: false }, methods: { // 確認用 print: function () { alert(this.boolean); } } }) ``` ## 参考 URL - https://forum.vuejs.org/t/how-to-return-boolean-and-not-string-when-using-select/14672 - https://stackoverflow.com/questions/45264923/how-to-return-boolean-and-not-string-when-using-select