Vue.jsのv-modelが使用されているフォームにイベント処理を追加したい場合

Vue.jsでv-model記述に関わる部分を触った際の備忘録になります。
間違っているところや、もっと良い方法などあったら教えていただけると助かります。

v-modelはVue.jsを使ってフォームを構築する際によく使う機能で、v-onとv-bindをまとめて一行で書くためのシュガーシンタックスです。

v-modelを使った際の展開のされ方は以下の通り。

フォームの種類	v-bind:	v-on:
テキストボックス、テキストエリア	value	input
チェックボックス、ラジオボタン	checked	change
セレクトボックス	value	change

v-modelはイベントハンドリングそのものを兼ねているため、v-modelが既に記述されているフォームに対して入力（選択）内容が変更された時にイベントを発火させようと@changeや@inputを記述すると、イベントが重複してしまいます。
もしchangeやinputイベントで単なる代入以上の処理をしたい場合は、2通りの方法があります。

1.v-modelを使用せず、v-bindとv-onを別々に書く
2.算出プロパティを使う

例として、下記の動作を実装した各方法での記述を記載します。
1.セレクトボックスの「選択肢2」を選択した際に、その下のinputが2つ格納されているdivを非表示にし、非表示にしたinputに対して指定の値を代入する。
2.セレクトボックスの「選択肢2」ではないものを選択した際に、その下のinputが2つ格納されているdivを再表示し、inputの中に指定の値が入っていた場合、値をクリアにする。

v-modelを使用せず、v-bindとv-onを別々に書く場合

<div id="form_vue_wrap" v-cloak>
	<div>
		<select name="select_aaa" id="form-select_aaa" @change="change_aaa()">
			<option value="">選択してください</option>
			<option value="01">選択肢1</option>
			<option value="02">選択肢2</option>
			<option value="03">選択肢3</option>
		</select>
	</div>
	<div v-show="select_aaa != '02'">
		<input type="text" name="input_bbb" id="input_bbb" v-model="$v.input_bbb.$model">
		<input type="text" name="input_ccc" id="input_ccc" v-model="$v.input_ccc.$model">
	</div>
</div>
<script>
	form_vue = new Vue({
		el: '#form_vue_wrap',
		data: {
			select_aaa: '',
			input_bbb: '',
			input_ccc: ''
		},
		methods: {
			change_aaa: function(){
				var val = $('#form-select_aaa').val();
				this.select_aaa = val;
				if (this.select_aaa == '02'){
					this.input_bbb = 'dummy-bbb';
					$('#input_bbb').val('dummy-bbb');
					this.input_ccc = 'dummy-ccc';
					$('#input_ccc').val('dummy-ccc');
				} else {
					if (this.input_bbb == 'dummy-bbb' && this.input_CCC == 'dummy-ccc'){
						this.input_bbb = '';
						$('#input_bbb').val('');
						this.input_ccc = '';
						$('#input_ccc').val('');
					}
				}
			}
		}
	});
</script>

算出プロパティを使う場合

<div id="form_vue_wrap" v-cloak>
	<div>
		<select name="select_aaa" id="form-select_aaa" v-model="select_aaa_change">
			<option value="">選択してください</option>
			<option value="01">選択肢1</option>
			<option value="02">選択肢2</option>
			<option value="03">選択肢3</option>
		</select>
	</div>
	<div v-show="select_aaa != '02'">
		<input type="text" name="input_bbb" id="input_bbb" v-model="$v.input_bbb.$model">
		<input type="text" name="input_ccc" id="input_ccc" v-model="$v.input_ccc.$model">
	</div>
</div>
<script>
	form_vue = new Vue({
		el: '#form_vue_wrap',
		data: {
			select_aaa: '',
			input_bbb: '',
			input_ccc: ''
		},
		computed: {
			select_aaa_change : {
				get() {
					return this.select_aaa
				},
				set(value) {
					this.select_aaa = value;
					if (this.select_aaa == '02'){
						this.input_bbb = 'dummy-bbb';
						$('#input_bbb').val('dummy-bbb');
						this.input_ccc = 'dummy-ccc';
						$('#input_ccc').val('dummy-ccc');
					} else {
						if (this.input_bbb == 'dummy-bbb' && this.input_CCC == 'dummy-ccc'){
							this.input_bbb = '';
							$('#input_bbb').val('');
							this.input_ccc = '';
							$('#input_ccc').val('');
						}
					}
				}
			}
		}
	});
</script>