Object.defineProperty

luffy_ltf

于 2021-06-11 11:52:00 发布

阅读量146

点赞数

文章标签： javascript vue.js

本文链接：https://blog.csdn.net/luffy_ltf/article/details/117811369

版权

Object.defineProperty()

作用就是直接在一个对象上定义一个新属性，或者修改一个已经存在的属性

Object.defineProperty(obj, prop, desc)

1.obj 需要定义属性的当前对象
2.prop 当前需要定义的属性名
3.desc 属性描述符

html实现数据绑定

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vue2.x数据双向绑定</title>
</head>

<body>
    <div>
        <input type="text" id="input">
        <span id="text"></span>
    </div>
</body>
<script>
    var obj = {}
    Object.defineProperty(obj, 'props', {
        get: function() {
            return val
        },
        set: function(newval) {
            val = newval;
            document.getElementById('text').innerHTML = val
        }
    })
    document.addEventListener('keyup', function(params) {
        obj.props = params.target.value
    })
</script>

</html>