首页
友链
壁纸
留言
今日热榜
更多
关于
时光
推荐
精品流量卡
Search
1
都二十多年了,你的梦为什么还没碎!
57,087 阅读
2
2022年5个好用的 BT/ 磁力链接下载工具推荐 |Windows 、安卓系统
37,356 阅读
3
nps内网穿透实现外网访问树莓派
32,424 阅读
4
实践利用宝塔建emlog个人博客-超详细【原创】
26,132 阅读
5
Typecho-Joe-Theme主题帮助文档
24,616 阅读
闲杂乱码
Python
网站源码
微信小程序
娱乐分享
Is相册
软件工具
登录
Search
标签搜索
PHP
HTML
API
Javascript
源码
JS
Vue
Github
CloudFlare
接口
函数
SQL
ASP.NET
MVC
EF
T4模板
后台管理
CDN
微信小程序
MAC
韩小韩
累计撰写
261
篇文章
累计收到
1,305
条评论
首页
栏目
闲杂乱码
Python
网站源码
微信小程序
娱乐分享
Is相册
软件工具
页面
友链
壁纸
留言
今日热榜
关于
时光
推荐
精品流量卡
搜索到
1
篇与
Object
的结果
2021-06-13
Object.defineProperty 及 实现数据双向绑定
{message type="info" content="Object.defineProperty() 和 Proxy 对象,都可以用来对数据的劫持操作。何为数据劫持呢?就是在我们访问或者修改某个对象的某个属性的时候,通过一段代码进行拦截行为,然后进行额外的操作,然后返回结果。那么vue中双向数据绑定就是一个典型的应用。Vue2.x 是使用 Object.defindProperty(),来进行对对象的监听的。Vue3.x 版本之后就改用Proxy进行实现的。"/}示例代码<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Object.defineProperty 及 实现数据双向绑定</title> <input type="text"> <h1></h1> </head> <body> <script> const ipt = document.querySelector('input'); const h = document.querySelector('h1'); let hanObj = { name: '', _name: '' }; Object.defineProperty(hanObj, 'name', { get() { return hanObj._name; }, set(sval) { hanObj._name = sval h.innerHTML = sval ipt.value = sval } }) ipt.oninput = function () { hanObj.name = this.value } </script> </body> </html>
2021年06月13日
278 阅读
0 评论
0 点赞