美文网首页
vue是怎么实现数据双向绑定的

vue是怎么实现数据双向绑定的

作者: 锋叔 | 来源:发表于2018-12-24 18:54 被阅读0次
    image.png
    
    <!DOCTYPE html>
    <html lang="en">
    
        <head>
            <meta charset="utf-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <title>vue怎么是想数据的双向绑定</title>
            <meta name="viewport" content="initial-scale=1, maximum-scale=1">
            <link rel="shortcut icon" href="/favicon.ico">
            <meta name="apple-mobile-web-app-capable" content="yes">
            <meta name="apple-mobile-web-app-status-bar-style" content="black">
        </head>
    
        <body style="text-align: center">
            <input type="text" id="txt"/>
            <p id="show"></p>
            <script>
                var obj = {}
                var txt = document.getElementById('txt')
                var show = document.getElementById('show')
                Object.defineProperty(obj, "txt", {
                    get: function () {return obj},
                    set: function (val) { show.innerHTML = val }
               })
               txt.addEventListener('keyup', function(e) {
                    obj.txt = e.target.value
               })
            </script>
        </body>
    
    </html>
    

    就是这么简单!你也会。写这个的目的是因为面试高级前端可能会遇到这个面试题。

    相关文章

      网友评论

          本文标题:vue是怎么实现数据双向绑定的

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