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

MobX 的 Observable Array,如何转换成一个普通的数组

问题描述

访问mobx store里面的数据时打印结果为如下,是一个 MobX 的 Observable Array,而不是一个普通的数组。MobX 使用 Proxy 来实现响应式数据,因此打印的结果为的是 Proxy 对象。可是我需要的是实际的数组数据。

Proxy {0: Proxy, 1: Proxy, 2: Proxy, Symbol(mobx administration): ObservableArrayAdministration2}

解决方案

如果你想要访问实际的数组数据,可以通过调用 MobX 的 toJS 函数将其转换为普通 JavaScript 对象。

import { toJS } from 'mobx';
consst navData = toJS(store.navData)
console.log('实际数组', navData);

运行结果

相关文章:

MobX 的 Observable Array,如何转换成一个普通的数组

问题描述 访问mobx store里面的数据时打印结果为如下,是一个 MobX 的 Observable Array,而不是一个普通的数组。MobX 使用 Proxy 来实现响应式数据,因此打印的结果为的是 Proxy 对象。可是我需要的是实际的数组数据。 Proxy {0: Proxy, 1: …...

spring boot集成loback日志配置

1.spring boot中application.properties配置 logging.configclasspath:loback-config.xml 2.配置loback-config.xml <?xml version"1.0" encoding"UTF-8"?> <!-- 日志级别从低到高分为TRACE < DEBUG < INFO < WARN < ERROR <…...

【mars3d】 graphic.bindPopup(inthtml).openPopup()无需单击小车,即可在地图上自动激活弹窗的效果。

实现效果&#xff1a;new mars3d.graphic.FixedRoute({无需单击小车&#xff0c;即可在地图上实现默认打开弹窗的激活效果。↓↓↓↓↓↓↓↓ 相关链接说明&#xff1a; 1.popup的示例完全开源&#xff0c;可参考&#xff1a;功能示例(Vue版) | Mars3D三维可视化平台 | 火星科…...

工厂企业消防安全AI可视化视频智能监管解决方案

一、方案背景 2023年11月20日下午6时30分许&#xff0c;位于江苏省无锡市惠山区前洲街道的某公司突发严重火灾&#xff0c;共造成7人死亡。这次火灾提醒我们工业安全至关重要&#xff0c;企业都应该时刻保持警惕&#xff0c;加强安全意识和培训&#xff0c;提高应对突发事件的…...

【并发编程】synchornized原理

&#x1f4dd;个人主页&#xff1a;五敷有你 &#x1f525;系列专栏&#xff1a;并发编程 ⛺️稳重求进&#xff0c;晒太阳 目录 Monitor概念 Java对象头 普通对象 数组对象 Monitor(锁) Monitor结构如下&#xff1a; 注意&#xff1a; 原理之synchornized 轻量…...

计算机网络-ACL访问控制列表

上一篇介绍NAT时候就看到了ACL这个东西了&#xff0c;这个是什么意思&#xff1f;有什么作用呢&#xff1f; 一、ACL访问控制列表 访问控制列表 (ACL, Access Control List)是由一系列permit或deny语句组成的、有序规则的列表。ACL是一个匹配工具&#xff0c;能够对报文进行匹配…...

论文学习记录之SeisInvNet(Deep-Learning Inversion of Seismic Data)

目录 1 INTRODUCTION—介绍 2 RELATED WORKS—相关作品 3 METHODOLOGY AND IMPLEMENTATION—方法和执行 3.1 方法 3.2 执行 4 EXPERIMENTS—实验 4.1 数据集准备 4.2 实验设置 4.3 基线模型 4.4 定向比较 4.5 定量比较 4.6 机理研究 5 CONCLUSION—结论 1 INTRODU…...

深度学习中的优化方法

深度学习中的优化问题通常指的是:寻找神经网络上的一组参数 θ \theta θ,它能显著地降低代价函数 J ( θ ) J(\theta) J(θ...

【设计模式之美】重构(三)之解耦方法论:如何通过封装、抽象、模块化、中间层等解耦代码?

文章目录 一. “解耦”概述二. 如何给代码“解耦”&#xff1f;1. 封装与抽象2. 中间层2.1. 引入中间层能**简化模块或类之间的依赖关系**。2.2. 引入中间层可以起到过渡的作用&#xff0c;能够让开发和重构同步进行&#xff0c;不互相干扰。 3. 模块化4. 其他设计思想和原则4.…...

Spring MVC学习之——Controller类中方法的返回值

Controller类中方法的返回值 1.返回ModelAndView RequestMapping("/hello")public ModelAndView hello(){//封装了页面和数据ModelAndView view new ModelAndView();//对这个请求的页面添加属性&#xff08;数据&#xff09;view.addObject("hello",&quo…...

IDEA中启动项目报堆内存溢出或者没有足够内存的错误

1.报错现象 java.lang.OutOfMemoryError: Java heap space 或者 Could not reserve enough space for object heap 2.解决办法 在运行配置中VM选项后加下面的配置&#xff1a; -server -XX:MaxHeapSize256m -Xms512m -Xmx512m -XX:PermSize128M -XX:MaxPermSize256m 3.JVM虚…...

Angular: DOCUMENT

不用原生的 document&#xff0c;是因为不利于后端渲染&#xff0c;所以避免使用原生浏览器的对象 import { DOCUMENT } from angular/common; import { Directive, Inject, Input, OnChanges, Output, Renderer2, SimpleChanges } from angular/core;Directive({selector: [a…...

mybatis-plus批量保存异常及效率优化

最近基于自己公司内部服务维护&#xff0c;发现其中调度中心近期出现不少错误日志&#xff0c;但是该任务却是正常执行&#xff0c;生成的报表数据也是正常的&#xff0c;所以很多天没有发现问题 这就匪夷所思了&#xff0c; 经仔细排查发现&#xff0c;是触发了feign超时hyst…...

查找局域网树莓派raspberry的mac地址和ip

依赖python库&#xff1a; pip install socket pip install scapy运行代码&#xff1a; import socket from scapy.layers.l2 import ARP, Ether, srpdef get_hostname(ip_address):try:return socket.gethostbyaddr(ip_address)[0]except socket.herror:# 未能解析主机名ret…...

乐观锁与悲观锁:高并发场景下的选择

&#x1f604; 19年之后由于某些原因断更了三年&#xff0c;23年重新扬帆起航&#xff0c;推出更多优质博文&#xff0c;希望大家多多支持&#xff5e; &#x1f337; 古之立大事者&#xff0c;不惟有超世之才&#xff0c;亦必有坚忍不拔之志 &#x1f390; 个人CSND主页——Mi…...

vue2 省市区联动组件封装

在element ui中有级联选择器el-cascader,其实已经够用了,但是在实际需求中,发现el-cascader如果有三级,数据数组必须得三个才能完全展示,所以不符合实际需求,还是自定义封装吧 需求:省市区联动数组,有多少个显示多少个 这里使用element ui得el-select组件,思路是使用…...

VScode远程开发

VScode远程开发 在SSH远程连接一文中&#xff0c;我么介绍了如何使用ssh远程连接Jetson nano端&#xff0c;但是也存在诸多不便&#xff0c;比如:编辑文件内容时&#xff0c;需要使用vi编辑器&#xff0c;且在一个终端内&#xff0c;无法同时编辑多个文件。本节将介绍一较为实用…...

芯片设计重要工具—— IBM LSF 分布式高性能计算调度平台

IBM Spectrum LSF Suites 是面向分布式高性能计算 (HPC) 的工作负载管理平台和作业调度程序。基于 Terraform 的自动化现已可用&#xff0c;该功能可在 IBM Cloud 上为基于 IBM Spectrum LSF 的集群供应和配置资源。 借助我们针对任务关键型 HPC 环境的集成解决方案&#xff0…...

RDMA Scatter Gather List详解

1. 前言 在使用RDMA操作之前&#xff0c;我们需要了解一些RDMA API中的一些需要的值。其中在ibv_send_wr我们需要一个sg_list的数组&#xff0c;sg_list是用来存放ibv_sge元素&#xff0c;那么什么是SGL以及什么是sge呢&#xff1f;对于一个使用RDMA进行开发的程序员来说&#…...

【动态规划】24子数组系列_最长湍流子数组_C++

题目链接&#xff1a;最长湍流子数组 目录 题目解析&#xff1a; 算法原理 1.状态表示 2.状态转移方程 3.初始化 4.填表顺序 5.返回值 编写代码 题目解析&#xff1a; 题目让我们求返回 arr 的 最大湍流子数组的长度 由题可得&#xff1a; 如果比较符号在子数组中的…...

【kafka】Golang实现分布式Masscan任务调度系统

要求&#xff1a; 输出两个程序&#xff0c;一个命令行程序&#xff08;命令行参数用flag&#xff09;和一个服务端程序。 命令行程序支持通过命令行参数配置下发IP或IP段、端口、扫描带宽&#xff0c;然后将消息推送到kafka里面。 服务端程序&#xff1a; 从kafka消费者接收…...

树莓派超全系列教程文档--(61)树莓派摄像头高级使用方法

树莓派摄像头高级使用方法 配置通过调谐文件来调整相机行为 使用多个摄像头安装 libcam 和 rpicam-apps依赖关系开发包 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 配置 大多数用例自动工作&#xff0c;无需更改相机配置。但是&#xff0c;一…...

在HarmonyOS ArkTS ArkUI-X 5.0及以上版本中,手势开发全攻略:

在 HarmonyOS 应用开发中&#xff0c;手势交互是连接用户与设备的核心纽带。ArkTS 框架提供了丰富的手势处理能力&#xff0c;既支持点击、长按、拖拽等基础单一手势的精细控制&#xff0c;也能通过多种绑定策略解决父子组件的手势竞争问题。本文将结合官方开发文档&#xff0c…...

Cesium1.95中高性能加载1500个点

一、基本方式&#xff1a; 图标使用.png比.svg性能要好 <template><div id"cesiumContainer"></div><div class"toolbar"><button id"resetButton">重新生成点</button><span id"countDisplay&qu…...

【第二十一章 SDIO接口(SDIO)】

第二十一章 SDIO接口 目录 第二十一章 SDIO接口(SDIO) 1 SDIO 主要功能 2 SDIO 总线拓扑 3 SDIO 功能描述 3.1 SDIO 适配器 3.2 SDIOAHB 接口 4 卡功能描述 4.1 卡识别模式 4.2 卡复位 4.3 操作电压范围确认 4.4 卡识别过程 4.5 写数据块 4.6 读数据块 4.7 数据流…...

第25节 Node.js 断言测试

Node.js的assert模块主要用于编写程序的单元测试时使用&#xff0c;通过断言可以提早发现和排查出错误。 稳定性: 5 - 锁定 这个模块可用于应用的单元测试&#xff0c;通过 require(assert) 可以使用这个模块。 assert.fail(actual, expected, message, operator) 使用参数…...

让AI看见世界:MCP协议与服务器的工作原理

让AI看见世界&#xff1a;MCP协议与服务器的工作原理 MCP&#xff08;Model Context Protocol&#xff09;是一种创新的通信协议&#xff0c;旨在让大型语言模型能够安全、高效地与外部资源进行交互。在AI技术快速发展的今天&#xff0c;MCP正成为连接AI与现实世界的重要桥梁。…...

Unit 1 深度强化学习简介

Deep RL Course ——Unit 1 Introduction 从理论和实践层面深入学习深度强化学习。学会使用知名的深度强化学习库&#xff0c;例如 Stable Baselines3、RL Baselines3 Zoo、Sample Factory 和 CleanRL。在独特的环境中训练智能体&#xff0c;比如 SnowballFight、Huggy the Do…...

Element Plus 表单(el-form)中关于正整数输入的校验规则

目录 1 单个正整数输入1.1 模板1.2 校验规则 2 两个正整数输入&#xff08;联动&#xff09;2.1 模板2.2 校验规则2.3 CSS 1 单个正整数输入 1.1 模板 <el-formref"formRef":model"formData":rules"formRules"label-width"150px"…...

有限自动机到正规文法转换器v1.0

1 项目简介 这是一个功能强大的有限自动机&#xff08;Finite Automaton, FA&#xff09;到正规文法&#xff08;Regular Grammar&#xff09;转换器&#xff0c;它配备了一个直观且完整的图形用户界面&#xff0c;使用户能够轻松地进行操作和观察。该程序基于编译原理中的经典…...