当前位置: 首页 > news >正文

vue从入门到精通(六):数据代理

一,什么是数据代理

通过一个对象代理对另一个对象中属性的操作

二,object.defineproperty方法

object.defineproperty方法可以对对象追加属性

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>object.defineproperty方法</title></head><body></body><script type="text/javascript">let person = {name:'张三',sex:'男'}//对对象追加属性Object.defineProperty(person,'age',{value:18,// enumerable:true,//控制属性是否可以枚举 默认flase// writeable:true,//控制属性是否可以被修改,默认false// configurable:true,//控制属性是否可以被删除,默认false//当有人读取person的age属性时,get函数(getter)就会被调用,且返回值就是age的值get:function(){return 'aaa'},//当有人修改person的age属性时,set函数(setter)就会被调用,且收到修改的具体值set:function(value){console.log(value)}})console.log(Object.keys(person))console.log(person)</script>
</html>

使用object.defineproperty实现数据代理

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>使用object.defineproperty实现数据代理</title></head><body></body><script type="text/javascript">let obj={x:100}let obj2={y:200}object.defineproperty(obj2,'x'{get(){return obj.x},set(val){obj.x = val}})</script>
</html>

三,Vue中的数据代理

  1. Vue中的数据代理:
    通过vm对象来代理data对象中属性的操作(读/写)

  2. Vue中数据代理的好处:
    更加方便的操作data中的数据

  3. 基本原理:
    通过object.defineProperty()把data对象中所有属性添加到vm上。为每一个添加到vm上的属性,都指定一个getter/setter在getter/setter内部去操作(读/写)data中对应的属性。

相关文章:

vue从入门到精通(六):数据代理

一&#xff0c;什么是数据代理 通过一个对象代理对另一个对象中属性的操作 二&#xff0c;object.defineproperty方法 object.defineproperty方法可以对对象追加属性 <!DOCTYPE html> <html><head><meta charset"utf-8"><title>object…...

【C++修行之道】类和对象(二)类的6个默认成员函数、构造函数、析构函数

目录 一、类的6个默认成员函数 二、构造函数 2.1 概念 2.2 特性 2.2.5 自动生成默认构造函数 不进行显示定义的隐患&#xff1a; 2.2.6 自动生成的构造函数意义何在&#xff1f; 两个栈实现一个队列 2.2.7 无参的构造函数和全缺省的构造函数都称为默认构造函数&#x…...

【LeetCode热题100总结】239. 滑动窗口最大值

题目描述 给你一个整数数组 nums&#xff0c;有一个大小为 k 的滑动窗口从数组的最左侧移动到数组的最右侧。你只可以看到在滑动窗口内的 k 个数字。滑动窗口每次只向右移动一位。 返回 滑动窗口中的最大值 。 示例 1&#xff1a; 输入&#xff1a;nums [1,3,-1,-3,5,3,6,7]…...

【YOLOv9改进[Conv]】使用YOLOv10的空间通道解耦下采样SCDown模块替换部分CONv的实践 + 含全部代码和详细修改内容

本文将使用YOLOv10的空间通道解耦下采样SCDown模块替换部分CONv的实践 ,文中含全部代码和详细修改内容。 目录 一 YOLOv10 1 空间通道解耦下采样 2 可视化...

简单小游戏制作

控制台基础设置 //隐藏光标 Console.CursorVisible false; //通过两个变量来存储舞台的大小 int w 50; int h 30; //设置舞台&#xff08;控制台&#xff09;的大小 Console.SetWindowSize(w, h); Console.SetBufferSize(w, h);多个场景 int nowSceneID 1; while (true) …...

Delphi

Delphi&#xff0c;是美国 Borland&#xff08;宝兰&#xff09;公司於 1995 年开发在 Windows 平台下的快速应用程式开发工具 (Rapid Application Development&#xff0c;简称 RAD)&#xff0c;它的前身是在 DOS 下的产品 Borland Turbo Pascal。&#xff08;非开源软件&…...

Linux的shell脚本中的比大小

如果要将 -le 换成相反的&#xff08;即“大于”&#xff09;&#xff0c;你应该使用 -gt&#xff08;greater than&#xff09;。 所以&#xff0c;-le 的相反比较是 -gt。 但如果你想要一个包含“大于”和“不等于”的比较&#xff08;即“大于”&#xff09;&#xff0c;那…...

每日复盘-20240603

20240603 六日涨幅最大: ------1--------300637--------- 扬帆新材 五日涨幅最大: ------1--------300637--------- 扬帆新材 四日涨幅最大: ------1--------301306--------- 西测测试 三日涨幅最大: ------1--------301306--------- 西测测试 二日涨幅最大: ------1--------30…...

adb server version (22000) doesn‘t match this client (41); killing...

参考链接: adb server version (31) doesn’t match this client (41); killing… 解决此问题 电脑安装了360手机助手占用了adb的端口引起的。因为套接字的唯一性&#xff08;一个套接字只能由 协议/网络地址/端口号 唯一确定 &#xff09;&#xff0c;一个电脑只能有一个程序…...

如何使用 Connector API 将数据提取到 Elasticsearch Serverless 中

作者&#xff1a;来自 Elastic Jedr Blaszyk Elasticsearch 支持一系列摄取方法。 其中之一是 Elastic Connectors&#xff0c;它将 SQL 数据库或 SharePoint Online 等外部数据源与 Elasticsearch 索引同步。 连接器对于在现有数据之上构建强大的搜索体验特别有用。 例如&…...

体育赛事直播系统开发源码搭建

随着体育产业的蓬勃发展&#xff0c;体育赛事直播已成为广大观众获取赛事信息的重要途径。为了满足观众日益增长的需求&#xff0c;开发一套专业的体育赛事直播系统成为当务之急。本文将围绕体育赛事直播系统开发源码搭建进行深入探讨&#xff0c;从技术选型、系统架构、安全防…...

使用Jmeter进行性能测试

学习视频 B站UP主&#xff1a;白月黑羽编程 目录 Jmeter的下载 Jmeter界面 Jmeter操作 线程组与HTTP请求 测试一个请求 解决响应数据中 中文乱码的问题 HTTP请求默认值 录制网站流量 添加录制控制器 添加HTTP代理服务器 在浏览器配置代理 进行录制 模拟间隔时间 …...

AI技术的发展,会让你工作轻松吗

这两年&#xff0c;人工智能技术迅猛发展&#xff0c;AI产品层出不穷&#xff0c;尤其大语言模型&#xff08;LLM&#xff09;的爆火&#xff0c;许多人担心自己的工作会被AI取代。然而&#xff0c;如果AI技术发展到极致&#xff0c;再加上其他科学技术的高度发展&#xff0c;我…...

Spring-DI入门案例

黑马程序员SSM框架教程 文章目录 一、DI入门案例思路分析二、实现步骤2.1 删除service中使用new形式创建的Dao对象2.2 提供以来对象对应的setter方法2.3 配置service与到之间的关系 一、DI入门案例思路分析 基于IoC管理bean&#xff08;上个案例已经实现&#xff09;service中…...

ubuntu18.04 报错:fatal error: execution

一、问题描述 在ubuntu18.04上编译Faster-lio 报错&#xff1a; fatal error: execution: 没有那个文件或目录#include <execution> 二、解决方法 需要将g编译器更新到9.0 sudo add-apt-repository ppa:ubuntu-toolchain-r/test sudo apt update sudo apt install g…...

开源大模型与大模型api的使用优缺点

开源大模型和大模型 API 都是人工智能领域中的重要概念&#xff0c;它们各自有一些优缺点。 开源大模型&#xff1a; 优点&#xff1a; 免费使用&#xff1a; 大多数开源大模型是免费提供的&#xff0c;任何人都可以访问和使用这些模型&#xff0c;降低了使用门槛。可定制性…...

小红书前端2轮面试期望22K,全程问低代码设计

一面&#xff08;通过&#xff09; 1、好&#xff0c;那我们开始把&#xff0c;先简单介绍一下自己的一个经历&#xff0c;以及自己有亮点的项目&#xff1f;balabala 2、你可以这样介绍&#xff1a;在这里边主要负责哪几个项目&#xff0c;哪些项目是比较有亮点的&#xff0…...

HIK录像机GB28181对接相机不在线问题随笔

一、问题现象 【设备信息】型号&#xff1a;DS-8664N-I16-V3 V4.63.000 build 230412 【问题现象】HIK录像机使用GB28181对接异常相机无法正常上线&#xff0c;对接HIK相机可以正常上线。 【现场拓扑】现场拓扑如下 NVR侧使用固定公网IP地址。IPC侧使用家用宽带的方式&…...

stm32-DMA转运数据

在配置前要记得先定义一下DMA转运的源端数组和目标数组两个数组哦。 接下来我们就开始准备配置吧 配置 初始化 1.RCC开启时钟&#xff08;开启DMA的时钟&#xff09; void RCC_AHBPeriphClockCmd(uint32_t RCC_AHBPeriph, FunctionalState NewState) 作用&#xff1a;开启时…...

Java编程常见问题汇总一

系列文章目录 文章目录 系列文章目录前言一、字符串连接误用二、错误的使用StringBuffer三、测试字符串相等性四、数字转换成字符串五、利用不可变对象(Immutable) 前言 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分…...

Android媒体开发 -(2)ExoPlayer高级功能:播放列表与动态资源加载

1. ExoPlayer播放列表基础操作 在Android媒体开发中&#xff0c;ExoPlayer的播放列表管理功能远比想象中强大。记得我第一次用MediaPlayer实现播放列表时&#xff0c;不得不手动处理队列切换和状态同步&#xff0c;而ExoPlayer通过ConcatenatingMediaSource和MediaItem的配合&a…...

【设计模式】遍历集合的艺术:深入探索迭代器模式的无限可能

在技术领域&#xff0c;我们常常被那些闪耀的、可见的成果所吸引。今天&#xff0c;这个焦点无疑是大语言模型技术。它们的流畅对话、惊人的创造力&#xff0c;让我们得以一窥未来的轮廓。然而&#xff0c;作为在企业一线构建、部署和维护复杂系统的实践者&#xff0c;我们深知…...

技术赋能B端拓客:号码核验行业的迭代与价值升级

2026年&#xff0c;数字经济高质量发展进入深水区&#xff0c;B端市场的竞争逻辑已从“规模制胜”转向“效能突围”&#xff0c;拓客环节的精细化、高效化成为企业构建核心竞争力的关键。号码核验作为B端拓客的前置基础性环节&#xff0c;直接关联线索质量、人力效能与拓客投入…...

文字识别OCR 在线工具 vs OCR API 接口平台:普通用户和开发者该怎么选?

随着 AI 发展&#xff0c;OCR 已经成了办公、学习、开发必备工具。 但现在市面上的 OCR 工具大致分两类&#xff1a; 在线 OCR 网站&#xff08;网页直接用&#xff09; OCR API 接口平台&#xff08;系统对接用&#xff09; 很多人不知道该怎么选&#xff0c;我从【普通用…...

家用混动SUV舒适度技术科普入门:从实测看核心技术要点

在家用混动SUV的日常使用中&#xff0c;接送孩子上下学、家庭短途出行是最高频的场景&#xff0c;而“舒适度”并非单纯的主观感受&#xff0c;而是一套涵盖空间设计、座椅工程、材质工艺、座舱适配及动力平顺性的综合技术体系。对于有儿童乘坐需求的家庭而言&#xff0c;舒适度…...

企业PTC软件正版化路径与长期价值分析

企业PTC软件正版化路径和长期价值分析我帮一家制造业客户处理软件正版化问题&#xff0c;提醒一句到他们的巨头供应商PTC的许可证使用率常年徘徊在30%左右&#xff0c;年均浪费成本超过800万&#xff0c;这事儿在行业内其实挺普遍的。如果说你正在为软件许可证管理头疼&#xf…...

YOLO26涨点改进| TPAMI 2026 |独家创新首发、Conv改进篇| 引入LPM 局部先验特征增强模块,更加聚焦于目标区域并抑制背景干扰,助力目标检测、图像分割、图像恢复、图像增强有效涨点

一、本文介绍 🔥本文给大家介绍使用 LPM 局部先验特征增强模块 改进YOLO26网络模型,通过构建重要性图对特征提取过程进行引导,使模型能够更加聚焦于目标区域并抑制背景干扰,从而提升特征表达质量和目标区分能力。其优势体现在能够有效增强关键区域信息、提升小目标和复杂…...

嵌入式软件开发中的柔性数组机制

在嵌入式系统开发中,内存资源始终是最核心的约束之一。无论是微控制器还是低功耗控制终端,程序设计都必须在有限的存储空间中实现功能、效率与可靠性的平衡。因此,开发者不仅需要关注算法逻辑,还必须重视数据结构对内存的占用方式。 在这种背景下,柔性数组成为嵌入式软件…...

Nunchaku-FLUX.1-dev开源镜像部署教程:免编译、免依赖、一键拉起服务

Nunchaku-FLUX.1-dev开源镜像部署教程&#xff1a;免编译、免依赖、一键拉起服务 1. 开篇&#xff1a;为什么你需要这个本地文生图神器&#xff1f; 如果你玩过AI绘画&#xff0c;肯定遇到过这些烦心事&#xff1a;想用国外模型生成中文场景&#xff0c;结果出来的图不伦不类…...

nlp_gte_sentence-embedding_chinese-large模型在嵌入式Linux系统上的优化部署

nlp_gte_sentence-embedding_chinese-large模型在嵌入式Linux系统上的优化部署 1. 引言 在智能硬件和边缘计算快速发展的今天&#xff0c;越来越多的设备需要在本地运行AI模型。对于嵌入式Linux系统来说&#xff0c;如何在资源受限的环境下高效部署大型文本表示模型&#xff…...