7.v-model的原理

2019-10-23  本文已影响0人  最爱喝龙井

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>
上一篇下一篇

猜你喜欢

热点阅读