web学习笔记(六十八)项目总结

目录

1.如何取到对象的第一项的键名

2.如何在键名不确定的情况下取到对象的第一项的值

3.如何获取对象的长度 

4.计算属性和watch监听监听深层数据

5.样式穿透


1.如何取到对象的第一项的键名

可以通过Object.keys将对象转化为一个包含对象所有可枚举属性名的数组,转换后就可以通过索引来取到对应的键名。

// 访问第一项的键
const issukdiv = ref(Object.keys(data.value.productValue)[0])

2.如何在键名不确定的情况下取到对象的第一项的值

// 访问第一项的值
const firstKey = data.value.productValue[issukdiv.value]

我们平常调用对象的某一项时都是直接打点取值,但是当键名不确定,是个变量时,我们就可以通过中括号来取值 ,两者有些许的区别:

  • 中括号运算符总是可以替代点运算符,但点运算符不一定能全部替代中括号运算符(键名不确定时)
  • 中括号运算符可以用字符串变量的内容作为属性名,而点运算符却不可以。
  • 中括号运算符可以用纯数字为属性名,点运算符不能。
  • 中括号运算符可以用js的关键字和保留字作为属性名,点运算符不可以。

3.如何获取对象的长度 

因为对象没有.length属性,但是我们可以通过object.keys获得一个包含对象所有键名的数组,然后通过object.keys(obj).length来获取键名数组的长度,这个长度就是对象的长度。

4.计算属性和watch监听监听深层数据

watch对于引用类型,默认只能监听第一层的变化,深层数据的变化监听不了但是可以通过设置deep:true来开启深度监听。但是当深层数据被改变时,计算属性仍然可以重新计算,无需关系数据的层次问题。

5.样式穿透

通常我们在编写代码会设置样式为scoped模式,使得该组件的样式只在本页面生效。但是在使用一些第三方组件的时候,通过内部类名设置样式可能会不生效,因此使用样式穿透,让内部类名突破scoped的限制,从而生效。eg:

::v-deep(.van-sidebar-item) {height: 1.3333rem;width: 2.2933rem;color: #333;font-size: 0.3467rem;
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/35266.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java中的微服务架构实现方法

Java中的微服务架构实现方法 大家好,我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编,也是冬天不穿秋裤,天冷也要风度的程序猿! 在当今软件开发的环境中,微服务架构已经成为了构建大型应用程序的主流…

NIVision-LabVIEW在灰度图上画圆

问题来源 在csdn上看到的这样一个问题,好像也没个正经答案,都用chatGPT回答,挺没劲的。不说提供个vi源代码,至少也来张截图嘛。我想着问题也不难,就自己动动手吧。 代码展示1 1、首先使用imaq ArrayToImage.vi创建了一…

java error ConcurrentModificationException 并发修改异常

ConcurrentModificationException 概述 这个异常在 Java 中通常发生在以下场景:当某个线程在遍历一个集合(如 ArrayList、HashMap 等)的过程中,另一个线程尝试修改这个集合的结构(如添加、删除元素)&#…

java中处理RunTimeException类的方式

在Java中,RuntimeException是所有运行时异常的父类。一些常见的RuntimeException子类包括: NullPointerException(空指针异常):当试图访问空对象的属性或调用空对象的方法时抛出。IllegalArgumentException&#xff0…

sheng的学习笔记-AI-学习向量量化

AI目录 sheng的学习笔记-AI目录-CSDN博客 需要学习前置知识:聚类,可参考 sheng的学习笔记-AI-聚类(Clustering)-CSDN博客 什么是学习向量量化 “学习向量量化”(Learning Vector Quantization,简称LVQ)是试图找到一…

【Android面试八股文】ViewHolder为什么要被声明成静态内部类?

文章目录 ViewHolder为什么要被声明成静态内部类?1. 避免隐式引用导致的内存泄漏2. 提高性能3. 代码可读性和维护性实例代码总结ViewHolder为什么要被声明成静态内部类? 将 ViewHolder 声明为静态内部类有几个重要的原因,这样做可以提高性能并避免潜在的内存泄漏。下面是详…

Qt | 子类化 QStyle(Qt自带图标大全)

01、简介 1、把绘制自定义部件外观的步骤大致分为三大板块,如下: ①、样式元素:即指定需要绘制的图形元素(比如焦点框、按钮,工具栏等)。样式元素使 用 QStyle 类中的一系列枚举(共有 11 个枚举)进行描述。 ②、样式选项:包含了需要绘制的图形元素的所有信息,比如包含…

Tomcat 下载部署到 idea

一、下载Tomcat Tomcat 是Apache 软件基金会(Apache Software Foundation)下的一个核心项目,免费开源、并支持Servlet 和JSP 规范。属于轻量级应用服务器,在中小型系统和并发访问用户不是很多的场合下被普遍使用,是开发…

启动VMWare虚拟机报错

1. 无法打开内核设备“\\.\VMCIDev\VMX”: 操作成功完成。是否在安装 VMware Workstation 后重新引导? 模块“DevicePowerOn”启动失败。 未能启动虚拟机。 解决办法: 解决办法: 将 Ubuntu 64 位.vmx 找到vmci0.present"TRUE"这行改成 vmci0.present "FAL…

wireshark工具获取设备IP地址

背景: 一个网口抓包工具,主要是升级XX设备时候不知道网口的ip地址。每次需要一个一个试,比较麻烦。 使用步骤: 1、连接好XX设备与笔记本,在网络连接里面找到以太网,没有出现红色X号,表示网线连…

文心一言 VS 讯飞星火 VS chatgpt (289)-- 算法导论21.3 2题

二、写出使用路径压缩的 FIND-SET 过程的非递归版本。如果要写代码,请用go语言。 文心一言: 在并查集(Union-Find)数据结构中,路径压缩(Path Compression)是一种优化技术,用于减少…

智能仓储:立体仓WCS设计

自动化立体仓库简称高架仓库,是采用高层货架存放货物,以巷道堆垛起重机为主,结合入库出库周边设备来进行作业的一种仓库。 立体仓主体由货架、巷道式堆垛机、输送机等组成。 电气控制系统、上位监控系统(Warehouse Control Syste…

【前后端实现】AHP权重计算

AHP权重计算: 需求:前端记录矩阵维度、上三角值,后端构建比较矩阵、计算权重值并将结果返回给前端 比较矩阵构建 如果你想要根据上三角(不包括对角线)的值来构建对称矩阵,那么你可以稍作修改上述的generate…

.NET 语言特定指南

.NET Language-Specific Guide 本指南将教您如何使用 Docker 创建容器化的 .NET 应用程序。通过本指南,您将学习如何: 容器化并运行 .NET 应用程序设置本地环境以使用容器开发 .NET 应用程序使用容器运行 .NET 应用程序测试使用 GitHub Actions 配置容…

量化交易面临的难题

量化交易面临的难题 1、监管机构对于算法交易、量化交易的监管越来越严格3、回测场景于实盘交易场景的不匹配性4、策略并非100%有效,并非100%的收益5、股票、基本面、市场新闻之间的关系时刻在变化并且难以捉摸6、很难使用一套通用的交易规则去匹配所有的股票/市场/…

U盘数据恢复实战:两大方案助您找回珍贵数据

在数字化时代,U盘作为我们随身携带的数据存储工具,承载着无数重要的文件和信息。然而,由于误操作、系统崩溃或硬件故障等原因,U盘中的数据可能会突然消失,给我们带来极大的困扰。本文将深入探讨U盘数据恢复的概念、方法…

常见大功率蓝牙应用有哪些?

在无线通信技术飞速发展的今天,蓝牙技术以其低功耗和易用性优势成为短距离无线通信的佼佼者。然而,随着智能家居、工业4.0等新型应用的兴起,蓝牙应用设备对通信距离和稳定性的要求越来越高。为了满足更大范围的无线通信需求,大功率…

山寨币大额解锁抛压拖累比特币:10X Research 深度剖析市场动荡

加密货币市场大幅下跌,山寨币损失惨重 在经历了几个月的强劲表现后,加密货币市场最近经历了一轮大幅下跌,特别是山寨币损失惨重。10X Research 最近在其Newsletter中发表了观点,认为山寨币大额解锁所带来的抛压正在拖累比特币。本…

使用Birdeye访问Sui上加密市场数据

是一个链上加密交易数据聚合器,于2024年4月开始整合Sui数据。 个人DeFi用户可以在Birdeye的首页找到丰富的数据,包括关于主流区块链上的tokens、交易和交易者钱包的详细信息。 Birdeye提供API和WebSockets数据服务,涵盖token价格和其他DeFi…

聚星文社ai工具下载

您可以在聚星文社官方网站上下载他们的AI工具。请访问他们的官方网站, 然后找到下载页面,从中选择并下载所需的AI工具。下载 如果您对下载过程有任何问题,建议您直接联系聚星文社的客服人员寻求帮助。