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

__ob__: Observer 后缀的数组的取值方式

开发中,经常从接口、父组件中,拿到数组然后给新的数组使用,
但是,有时候会发现带有 __ob__: Observer 后缀的数组,对这种数组来说,你是无法取到这个数组的值的,
而且,离谱的是console.log日志打印却能看到数组的值
数组如下图所示:
在这里插入图片描述
在 Vue 中,当你使用 Vue 的响应式系统来观察一个对象时,Vue 会在对象上添加一个名为 __ob__ 的属性,该属性是一个 Observer 对象,用于监听对象的变化。

__ob__ 属性的作用是追踪和管理对象的变化。它是 Vue 内部使用的属性,用于实现 Vue 的响应式机制。

当你将一个对象传递给 Vue 的响应式系统进行观察时,Vue 会遍历对象的所有属性,并为每个属性创建一个 Dep 对象,用于收集依赖和触发更新。同时,Vue 会创建一个 Observer 对象,它负责监听对象的变化,并在需要时通知 Dep 对象进行更新。

Observer 对象会将 __ob__ 属性添加到对象上,这样 Vue 就可以通过 __ob__ 属性来追踪对象的变化。当对象发生变化时,Observer 对象会通知 Dep 对象,然后 Dep 对象会触发相关的更新操作。

需要注意的是,__ob__ 属性是 Vue 内部使用的属性,你不能直接访问或修改它。
如果你需要判断一个对象是否被 Vue 监控,可以使用 Vue.observable 方法或 isObservable 函数来进行判断。


取值方式如下:
第一种方式:把这个换成同步的形式等你加载完之后再进行取值,就是说,你可以在data中定义一个变量tempArr,用tempArr取接收这个__ob__: Observer数组,然后再在别的方法中去使用这个变量tempArr就行了
或者
第二种方式:用定时器设置一个延迟,在这个定时器里面写你取值的逻辑

相关文章:

__ob__: Observer 后缀的数组的取值方式

开发中,经常从接口、父组件中,拿到数组然后给新的数组使用, 但是,有时候会发现带有 __ob__: Observer 后缀的数组,对这种数组来说,你是无法取到这个数组的值的, 而且,离谱的是consol…...

时序预测 | MATLAB实现WOA-CNN-BiLSTM鲸鱼算法优化卷积双向长短期记忆神经网络时间序列预测

时序预测 | MATLAB实现WOA-CNN-BiLSTM鲸鱼算法优化卷积双向长短期记忆神经网络时间序列预测 目录 时序预测 | MATLAB实现WOA-CNN-BiLSTM鲸鱼算法优化卷积双向长短期记忆神经网络时间序列预测预测效果基本介绍程序设计学习总结参考资料 预测效果 基本介绍 时序预测 | MATLAB实现…...

Java基础知识点

Java是一种高级计算机语言,是可以编写跨平台应用软件、完全面向对象的程序设计语言。 2、Java划分为三个技术平台:Java SE、Java EE、Java ME Java SE是桌面应用,Java EE是web应用,平台企业版,Java ME是手机应用&#…...

攻防世界-web-fileclude

1. 题目描述 打开链接,可以看到如下代码: 代码意思很简单,让我们传递两个参数,一个file1,一个file2,如果file2的内容为hello ctf,那么就可以在代码中include file1 2. 思路分析 这道题显然是…...

【100天精通python】Day36:GUI界面编程_高级功能操作和示例

专栏导读 专栏订阅地址:https://blog.csdn.net/qq_35831906/category_12375510.html 一、GUI 高级功能 1 自定义主题和样式 自定义主题和样式可以让你的GUI应用程序在外观方面更加出色。在使用Tkinter时,你可以使用ttkthemes库来应用不同的主题和样式。…...

无涯教程-Perl - sub函数

描述 此函数定义一个新的子例程。上面显示的参数遵循以下规则- NAME是子例程的名称。可以在有或没有原型规范的情况下预先声明命名的子例程(没有关联的代码块)。 匿名子例程必须具有定义。 PROTO定义了函数的原型,调用该函数以验证提供的参数时将使用该原型。 ATTRS为解析…...

wpf控件上移下移,调整子集控件显示顺序

页面代码: <!-- 导出A2,自定义导出设置列,添加时间:2023-8-9 14:14:18,作者:whl; --><Window x:Class="WpfSnqkGasAnalysis.WindowGasExportA2"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http:/…...

cesium学习记录08-鼠标绘制多边形

上一篇学习了实体的一些基础知识&#xff0c;这一篇来学习鼠标绘制实体多边形的实现 一、方法一&#xff1a; 1&#xff0c;结果显示 贴地&#xff1a; 不贴地&#xff1a; 2&#xff0c;方法全部代码&#xff1a; 主方法&#xff1a; /*** 绘制多边形* param {Object} op…...

rocketMq启动broker报错找不到或无法加载主类 Files\Java\jdk1.8.0_171\lib\dt.jar;C:\Program]

假如弹出提示框提示‘错误: 找不到或无法加载主类 xxxxxx’。 1.打开runbroker.cmd 将"%CLASSPATH%"加上英文双引号&#xff0c;切勿别加中文双引号 2.打开runserver.cmd 同理 将"%CLASSPATH%"加上英文双引号&#xff0c;切勿别加中文双引号 3.正常执行即…...

Linux touch 命令指南大全

1. 概述 在本教程中,我们将学习touch命令。简而言之,这个命令允许我们更新文件或目录的最后修改时间和最后访问时间。 因此,我们将重点关注如何使用该命令及其各种选项。 请注意,我们使用 Bash 测试了此处显示的所有命令;但是,它们应该与任何兼容 POSIX 的 shell 一起使…...

华为网络篇 RIPv2的基础配置-25

难度 1复杂度1 目录 一、实验原理 1.1 RIP的版本 1.2 RIP的路由更新方式 1.3 RIP的计时器 1.4 RIP的防环机制 二、实验拓扑 三、实验步骤 四、实验过程 总结 一、实验原理 RIP&#xff08;Routing Information Protocol&#xff0c;路由信息协议&#xff09;&am…...

fastadmin 下拉多级分类

要实现下图效果 一、先创建数据表 二、在目标的controll中引入use fast\Tree; public function _initialize() {parent::_initialize();$this->model new \app\admin\model\zxdc\Categorys;$tree Tree::instance();$tree->init(collection($this->model->order(…...

时序预测 | MATLAB实现基于CNN-LSTM卷积长短期记忆神经网络的时间序列预测-递归预测未来(多指标评价)

时序预测 | MATLAB实现基于CNN-LSTM卷积长短期记忆神经网络的时间序列预测-递归预测未来(多指标评价) 目录 时序预测 | MATLAB实现基于CNN-LSTM卷积长短期记忆神经网络的时间序列预测-递归预测未来(多指标评价)预测结果基本介绍程序设计参考资料 预测结果 基本介绍 MATLAB实现基…...

RabbitMQ工作流程详解

1 生产者发送消息的流程 (1)生产者连接RabbitMQ&#xff0c;建立TCP连接(Connection)&#xff0c;开启信道(Channel) (2)生产者声明一个Exchange (交换器)&#xff0c;并设置相关属性&#xff0c;比如交换器类型、是否持久化等 (3)生产者声明一个队列井设置相关属性&#xf…...

LabVIEW使用图像处理进行交通控制性能分析

LabVIEW使用图像处理进行交通控制性能分析 采用普雷维特、拉普拉斯、索贝尔和任意的空间域方法对存储的图像进行边缘检测&#xff0c;并获取实时图像。然而&#xff0c;对四种不同空间域边缘检测方法的核的性能分析。 以前&#xff0c;空路图像存储在数据库中&#xff0c;道路…...

CentOS 7 下 Keepalived + Nginx 实现双机高可用

CentOS 7 下 Keepalived Nginx 实现双机高可用 文章目录 CentOS 7 下 Keepalived Nginx 实现双机高可用服务器准备服务信息服务架构 服务安装nginxKeepalived 服务配置nginxKeepalived 启动服务nginxkeepalived 服务验证查看 VIP 状态CURL 命令访问浏览器访问 高可用验证停止…...

【Linux】IO多路转接——select接口

目录 I/O多路转接之select select初识 select函数 socket就绪条件 select基本工作流程 select服务器 select的优点 select的缺点 select的适用场景 I/O多路转接之select select初识 select是系统提供的一个多路转接接口。 select系统调用可以让我们的程序同时监视多…...

error_Network Error

此页面为订单列表&#xff0c;是混合开发(页面嵌入在客户端中) 此页面为订单列表&#xff0c;此需求在开发时后端先将代码发布在测试环境&#xff0c;我在本地调试时调用的后端接口进行联调没有任何问题。 此后我将代码发布在测试环境&#xff0c;在app中打开页面&#xff0c…...

Python爱心光波

文章目录 前言Turtle入门简单案例入门函数 爱心光波程序设计程序分析 尾声 前言 七夕要来啦&#xff0c;博主在闲暇之余创作了一个爱心光波&#xff0c;感兴趣的小伙伴们快来看看吧&#xff01; Turtle入门 Turtle 是一个简单而直观的绘图工具&#xff0c;它可以帮助你通过简…...

【分布式】Viewstamped Replication Revisited

篇前感悟&#xff1a; 阅读分布式系统文章的意义其实并不在于你个人真正地去开发这样一个基于这种协议的系统&#xff0c;因为真正去开发一个高可用的分布式系统实在是太难了&#xff08;对我来说…&#xff09;更多的还是汲取其中的思想&#xff0c;包括设计思路&#xff0c;优…...

德意志飞机通过全球协作升级支线航空驾驶舱人机工学

2026年1月15日 —— 作为总部位于德国舍瑙的MAFELEC集团旗下成员&#xff0c;COMTRONIC GmbH近五十年来一直是航空航天领域人机界面&#xff08;HMI&#xff09;解决方案领域值得信赖的供应商。凭借在照明面板、定制键盘及先进光学技术方面的深厚积淀&#xff0c;COMTRONIC长期…...

请解释 Linux 系统中的内核模块管理,并描述如何加载和卸载模块。

在 Linux 系统中&#xff0c;内核模块&#xff08;Kernel Modules&#xff09; 是可以在不重新编译或重启内核的情况下&#xff0c;动态添加到运行中内核的代码片段。它们通常用于支持新的硬件设备、文件系统或网络协议。 这种机制使得 Linux 内核保持精简&#xff08;核心功能…...

别再死记硬背了!用C++/Java手把手实现线索二叉树(附完整代码与避坑指南)

从零实现线索二叉树&#xff1a;C/Java双语言实战与陷阱全解析 第一次在面试白板上遇到线索二叉树的实现题时&#xff0c;我的手心全是汗。教科书上的递归图示看起来清晰&#xff0c;但真正要写出无bug的线索化代码时&#xff0c;那些ltag和rtag就像捉迷藏的孩子&#xff0c;总…...

Python智能内存回收实战:3种GC策略对比+4个生产级调优参数配置(附压测数据)

第一章&#xff1a;Python智能体内存管理策略生产环境部署在高并发、长生命周期的Python智能体服务中&#xff0c;内存管理直接影响系统稳定性与响应延迟。默认的CPython引用计数循环垃圾回收&#xff08;GC&#xff09;机制在动态对象频繁创建销毁的场景下易引发内存抖动和不可…...

一文了解嵌入式硬件通信核心:串口/CAN/以太网,底层逻辑居然全一样!

做嵌入式、工控、硬件通信开发久了&#xff0c;总会有一个突然顿悟的瞬间&#xff1a;串口、以太网、CAN、TCP、USB、蓝牙、Modbus……这些看似毫无关联、应用场景天差地别的通信方式&#xff0c;扒开底层逻辑才发现&#xff0c;居然是同一个模子刻出来的。看透这一点后&#x…...

暗黑破坏神2重制版智能辅助:自动化流程与效率提升完全指南

暗黑破坏神2重制版智能辅助&#xff1a;自动化流程与效率提升完全指南 【免费下载链接】botty D2R Pixel Bot 项目地址: https://gitcode.com/gh_mirrors/bo/botty 在《暗黑破坏神2&#xff1a;重制版》的冒险旅程中&#xff0c;你是否曾因重复刷怪、繁琐的装备拾取而感…...

工程伦理案例分析:从经典失败项目看责任分配与风险预防

工程伦理案例分析&#xff1a;从经典失败项目看责任分配与风险预防 当一座桥梁在通车典礼上轰然倒塌&#xff0c;当一栋新建大楼在台风中支离破碎&#xff0c;这些触目惊心的工程事故背后&#xff0c;往往隐藏着复杂的伦理困境。工程伦理不是简单的对错判断题&#xff0c;而是需…...

高效安全的网页资源提取方案:猫抓开源工具的技术实现与专业应用

高效安全的网页资源提取方案&#xff1a;猫抓开源工具的技术实现与专业应用 【免费下载链接】cat-catch 猫抓 浏览器资源嗅探扩展 / cat-catch Browser Resource Sniffing Extension 项目地址: https://gitcode.com/GitHub_Trending/ca/cat-catch 在数字化时代&#xff…...

FinalShell v4.5.12 安装避坑指南:为什么你的远程连接总是失败?

FinalShell 4.5.12 高效配置手册&#xff1a;从安装到稳定连接的进阶实践 远程终端工具的选择往往决定了运维效率的天花板。作为一款集SSH连接、文件传输、性能监控于一体的全能型工具&#xff0c;FinalShell近年来在开发者社区中积累了不错的口碑。但不少用户在初次接触时&…...

文华财经与博易大师双轨期货多空变色线指标实战解析

1. 双轨期货多空变色线指标是什么&#xff1f; 如果你经常使用文华财经或博易大师进行期货交易&#xff0c;一定对主图上的各种技术指标不陌生。今天要介绍的这个双轨期货多空变色线指标&#xff0c;可以说是趋势交易者的"秘密武器"。简单来说&#xff0c;它就像给K线…...