vue中的数据劫持代理指的是开发者调用或修改组件data里的某个属性时可以直接使用this.属性名,而不用写成微信小程序的写法,写成this.data.属性名来获取。
先新建一个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>数据劫持代理</title>
</head>
<body>
<script src="./index.js"></script>
</body>
</html>
引入的index.js文件代码如下:
// vue的数据劫持代理
// 模拟data选项
let data = {
username: 'curry',
age: 33
}
// 模拟组件的实例
let _this = {
test: "测试"
}
// 利用Object.defineProperty()
// 这个方法接收三个参数:
// 1.属性所在的对象
// 2.属性的名字
// 3.一个描述符对象
for (let item in data) {
// item是key data[item]是value