<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>vue的双向数据绑定</title>
</head>
<body>
<input id="inputs" type="" name=""/>
<p id="ShowCont"></p>
</body>
</html>
<script type="text/javascript">
/**
* defineProperty:定义属性
* 第一个参数:要被定义的对象
* 第二个参数:要定义或修改的属性名称(任意名称)
* 第三个参数:将被定义或修改的属性描述
* */
var obj={};
Object.defineProperty(obj,"propertyName",{
get:function(){
return obj;
},
set:function(newValue){
document.getElementById("inputs").value=newValue;
document.getElementById("ShowCont").innerHTML = newValue;
}
});
document.getElementById("inputs").onkeyup = function(e){
obj.propertyName = e.target.value;
}
setTimeout(()=>{
//没有变化
// document.getElementById('inputs').value = '99999';
//视图更新了
obj.propertyName = '122222';
},3000)
</script>
<style>
</style>
网友评论