美文网首页
7.v-model的原理

7.v-model的原理

作者: 最爱喝龙井 | 来源:发表于2019-10-23 11:46 被阅读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>
    

    相关文章

      网友评论

          本文标题:7.v-model的原理

          本文链接:https://www.haomeiwen.com/subject/tlohvctx.html