v-model的实现原理:首先,通过属性绑定value,然后通过input事件,来动态的修改msg的值,来实现v-model的功能。
<div id="app">
<!-- <input type="text" v-model="msg"> -->
<input type="text" :value="msg" @input="change">
<h2>{{ msg }}</h2>
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
msg: 'hello world'
},
methods: {
change(e) {
this.msg = e.target.value
}
}
});
</script>
网友评论