Vue3-02

news/2024/11/19 21:50:28/

toRef 作用:创建一个 ref 对象,其value值指向另一个对象中的某个属性。
语法:const name = toRef(person,‘name’)
应用: 要将响应式对象中的某个属性单独提供给外部使用时。
扩展:toRefs与toRef功能一致,但可以批量创建多个 ref 对象,语法:oRefs(person)

computed函数

import {computed} from 'vue'setup(){...//计算属性——简写let fullName = computed(()=>{return person.firstName + '-' + person.lastName})//计算属性——完整let fullName = computed({get(){return person.firstName + '-' + person.lastName},set(value){const nameArr = value.split('-')person.firstName = nameArr[0]person.lastName = nameArr[1]}})
}

watch函数
与Vue2.x中watch配置功能一致
两个小“坑”:
监视reactive定义的响应式数据时:oldValue无法正确获取、强制开启了深度监视(deep配置失效)。
监视reactive定义的响应式数据中某个属性时:deep配置有效。


http://www.ppmy.cn/news/1548332.html

相关文章

为什么 Vue3 封装 Table 组件丢失 expose 方法呢?

在实际开发中,我们通常会将某些常见组件进行二次封装,以便更好地实现特定的业务需求。然而,在封装 Table 组件时,遇到一个问题:Table 内部暴露的方法,在封装之后的组件获取不到。 代码展示为: …

芯原科技嵌入式面试题及参考答案

Linux 相关驱动怎么写? 在 Linux 中编写驱动主要有以下步骤。 首先,需要了解设备的硬件特性。这包括设备的工作原理、寄存器地址和功能、中断号等信息。例如,对于一个简单的 GPIO 设备,要知道其数据寄存器、方向寄存器的位置以及读写操作的规则。 然后是模块的初始化部分。…

Python re 模块:正则表达式的强大工具

文章目录 Python re 模块:正则表达式的强大工具导入 re 模块基本匹配方法re.match()re.search()re.findall()re.finditer() 替换操作re.sub() 分割字符串re.split() 捕获组和非捕获组捕获组非捕获组 常用模式符号实际应用示例验证电子邮件格式提取 URL 预定义字符简…

【企业级分布式系统】ZooKeeper集群

文章目录 Zookeeper 概述Zookeeper 定义Zookeeper 工作机制Zookeeper 特点Zookeeper 数据结构Zookeeper 选举机制 部署 Zookeeper 集群准备 3 台服务器作为 Zookeeper 集群节点1. 安装前准备关闭防火墙安装 JDK下载安装包 2. 安装 Zookeeper修改配置文件拷贝配置好的 Zookeeper…

网络技术-访问控制列表(ACL)

访问控制列表(Access Control Lists,ACL)是一种基于包过滤的访问控制技术,它可以根据设定的条件对接口上的数据包进行过滤,允许其通过或丢弃。 备注:ACL被广泛地应用于路由器和三层交换机。 ACL的使用涉及…

HarmonyOS ArkUI(基于ArkTS) 开发布局 (上)

一 ArkUI(基于ArkTS)概述 基于ArkTS的声明式开发范式的方舟开发框架是一套开发极简、高性能、支持跨设备的UI开发框架,提供了构建应用UI所必需的能力 点击详情 特点 开发效率高,开发体验好 代码简洁:通过接近自然语义的方式描述UI&#x…

MySQL技巧之跨服务器数据查询:基础篇-A数据库与B数据库查询合并--封装到存储过程中

MySQL技巧之跨服务器数据查询:基础篇-A数据库与B数据库查询合并–封装到存储过程中 我们的最终目的是什么?当然的自动执行这些合并操作! 上一篇 MySQL技巧之跨服务器数据查询:基础篇-A数据库与B数据库查询合并 我们已经知道怎么合…

沃丰科技出海客服解决方案:为中国企业出海保驾护航

一、引言 随着全球化的不断深入和“一带一路”倡议的推进,越来越多的中国企业开始走出国门,拓展海外市场。然而,在海外市场拓展的过程中,客户服务作为企业与客户之间的桥梁,其重要性不言而喻。一个优秀的出海客服解决…