“Vue 理解数据代理”的版本间的差异
跳到导航
跳到搜索
Jihongchang(讨论 | 贡献) (建立内容为“https://www.bilibili.com/video/BV1Zy4y1K7SH?p=12”的新页面) |
Jihongchang(讨论 | 贡献) |
||
第1行: | 第1行: | ||
− | https://www.bilibili.com/video/BV1Zy4y1K7SH?p=12 | + | https://www.bilibili.com/video/BV1Zy4y1K7SH?p=12<syntaxhighlight lang="html"> |
+ | <!DOCTYPE html> | ||
+ | <html lang="en"> | ||
+ | <head> | ||
+ | <meta charset="UTF-8"> | ||
+ | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
+ | <title>何为数据代理</title> | ||
+ | </head> | ||
+ | <body> | ||
+ | <!-- 数据代理:通过一个对象代理对另一个对象中属性的操作 读/写 --> | ||
+ | <script type="text/javascript"> | ||
+ | let obj = {x:100} | ||
+ | let obj2 = {y:200} | ||
+ | |||
+ | Object.defineProperty(obj2, 'x', { | ||
+ | get(){ | ||
+ | return obj.x | ||
+ | }, | ||
+ | set(value){ | ||
+ | obj.x = value | ||
+ | } | ||
+ | }) | ||
+ | </script> | ||
+ | </body> | ||
+ | </html> | ||
+ | </syntaxhighlight> |
2024年7月28日 (日) 10:53的最新版本
https://www.bilibili.com/video/BV1Zy4y1K7SH?p=12
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>何为数据代理</title>
</head>
<body>
<!-- 数据代理:通过一个对象代理对另一个对象中属性的操作 读/写 -->
<script type="text/javascript">
let obj = {x:100}
let obj2 = {y:200}
Object.defineProperty(obj2, 'x', {
get(){
return obj.x
},
set(value){
obj.x = value
}
})
</script>
</body>
</html>