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

Vue3-shallowRef 和 shallowReactive函数(浅层次的响应式)

Vue3-shallowRef 和 shallowReactive函数(浅层次的响应式)

shallowRef函数

  • 功能:只给基本数据类型添加响应式。如果是对象,则不会支持响应式,层成也不会创建Proxy对象。
  • ref和shallowRef在基本数据类型上是没有区别的,shallowRef函数主要作用于不进行修改对象中的属性。

在这里插入图片描述

<template><h2>计数器1{{data.counter1}}</h2><button @click="data.counter1++">计数器11</button>
</template><script setup>import { shallowRef } from 'vue'let data = shallowRef({counter1 : 1})console.log(data);
</script>

shallowReactive函数

  • 功能:shallowReactive 对象中只有第一层支持响应式,之后的都不支持响应式。

在这里插入图片描述

<template><h2>计数器1{{data.counter1}}</h2><button @click="data.counter1++">计数器11</button><hr><h2>计数器2{{data.a.counter2}}</h2><button @click="data.a.counter2++">计数器21</button>
</template><script setup>import { shallowReactive } from 'vue'let data = shallowReactive({counter1 : 1,a : {counter2 : 100}})
</script>counter2 : 100}})
</script>

相关文章:

Vue3-shallowRef 和 shallowReactive函数(浅层次的响应式)

Vue3-shallowRef 和 shallowReactive函数&#xff08;浅层次的响应式&#xff09; shallowRef函数 功能&#xff1a;只给基本数据类型添加响应式。如果是对象&#xff0c;则不会支持响应式&#xff0c;层成也不会创建Proxy对象。ref和shallowRef在基本数据类型上是没有区别的…...

ExoPlayer架构详解与源码分析(8)——Loader

系列文章目录 ExoPlayer架构详解与源码分析&#xff08;1&#xff09;——前言 ExoPlayer架构详解与源码分析&#xff08;2&#xff09;——Player ExoPlayer架构详解与源码分析&#xff08;3&#xff09;——Timeline ExoPlayer架构详解与源码分析&#xff08;4&#xff09;—…...

ExoPlayer架构详解与源码分析(9)——TsExtractor

系列文章目录 ExoPlayer架构详解与源码分析&#xff08;1&#xff09;——前言 ExoPlayer架构详解与源码分析&#xff08;2&#xff09;——Player ExoPlayer架构详解与源码分析&#xff08;3&#xff09;——Timeline ExoPlayer架构详解与源码分析&#xff08;4&#xff09;—…...

【Python 千题 —— 基础篇】输出列表方差

题目描述 题目描述 输出列表的方差。题中有一个包含数字的列表 [10, 39, 13, 48, 32, 10, 9]&#xff0c;使用 for 循环获得这个列表中所有项的方差。 输入描述 无输入。 输出描述 输出列表的方差。 示例 示例 ① 输出&#xff1a; 列表的方差是&#xff1a;228.0代码…...

【Spring总结】基于配置的方式来写Spring

本篇文章是对这两天所学的内容做一个总结&#xff0c;涵盖我这两天写的所有笔记&#xff1a; 【Spring】 Spring中的IoC&#xff08;控制反转&#xff09;【Spring】Spring中的DI&#xff08;依赖注入&#xff09;Dependence Import【Spring】bean的基础配置【Spring】bean的实…...

Unity在Windows选项下没有Auto Streaming

Unity在Windows选项下没有Auto Streaming Unity Auto Streaming插件按网上说的不太好使最终解决方案 Unity Auto Streaming插件 我用的版本是个人版免费版&#xff0c;版本号是&#xff1a;2021.2.5f1c1&#xff0c;我的里边Windows下看不到Auto Streaming选项,就像下边这张图…...

下厨房网站月度最佳栏目菜谱数据获取及分析

目录 概要 源数据获取 写Python代码爬取数据 Scala介绍与数据处理 1.Sacla介绍...

【Java 进阶篇】深入理解 JQuery 事件绑定:标准方式

在前端开发中&#xff0c;处理用户与页面的交互是至关重要的一部分。JQuery作为一个广泛应用的JavaScript库&#xff0c;为我们提供了简便而强大的事件绑定机制&#xff0c;使得我们能够更加灵活地响应用户的行为。本篇博客将深入解析 JQuery 的标准事件绑定方式&#xff0c;为…...

某app c++层3处魔改md5详解

hello everybody,本期是安卓逆向so层魔改md5教学,干货满满,可以细细品味,重点介绍的是so层魔改md5的处理. 常见的魔改md5有: 1:明文加密前处理 2:改初始化魔数 3:改k表中的值 4:改循环左移的次数 本期遇到的是124.且循环左移的次数是动态的,需要前面的加密结果处理生成 目录…...

安装MongoDB

查看MongoDB版本可以执行如下命令 mongod --version 如果是Ubuntu&#xff0c;则直接安装 sudo apt-get install -y mongodb如果是其他&#xff0c;比如Amazon Linux2。 查看Linux系统发行版类型 grep ^NAME /etc/*release 如果是 Amazon Linux 2&#xff0c;则创建一个r…...

C++加持让python程序插上翅膀——利用pybind11进行c++和python联合编程示例

目录 0、前言1、安装 pybind11库c侧python侧 2、C引入bybind11vs增加相关依赖及设置cpp中添加头文件及导出模块cpp中添加numpy相关数据结构的接收和返回编译生成dll后改成导出模块同名文件的.pyd 3、python调用c4、C引入bybind11 0、前言 在当今的计算机视觉和机器学习领域&am…...

ubuntu20.04安装cv2

查看ubuntu的版本 cat /etc/lsb-release DISTRIB_IDUbuntu DISTRIB_RELEASE20.04 DISTRIB_CODENAMEfocal DISTRIB_DESCRIPTION"Ubuntu 20.04.3 LTS"更改镜像源 cp /etc/apt/sources.list /etc/apt/sources.list.bak cat > /etc/apt/sources.listdeb http://mirr…...

Android 13.0 recovery出厂时清理中字体大小的修改

1.前言 在13.0的系统rom定制化开发中,在recovery模块也是系统中比较重要的模块,比如恢复出厂设置,recovery ota升级, 清理缓存等等,在一些1080p的设备,但是density只是240这样的设备,会在恢复出厂设置的时候,显示的字体有点小, 产品要求需要将正在清理的字体调大点,这…...

spring+pom-注意多重依赖时的兼容问题[java.lang.NoSuchMethodError]

背景&#xff1a; 项目中同时引入了依赖A和依赖B&#xff0c;而这两个依赖都依赖于项目C&#xff0c;但它们指定的C版本不一致&#xff0c;导致运行时出现了错误。 报错如&#xff1a; java.lang.NoSuchMethodError 解决方案&#xff1a; 需要在项目pom文件中引入依赖C并指定需…...

Matalab插值详解和源码

转载&#xff1a;Matalab插值详解和源码 - 知乎 (zhihu.com) 插值法 插值法又称“内插法”&#xff0c;是利用函数f (x)在某区间中已知的若干点的函数值&#xff0c;作出适当的特定函数&#xff0c;在区间的其他点上用这特定函数的值作为函数f (x)的近似值&#xff0c;这种方…...

Flask 接口

目录 前言 代码实现 简单接口实现 执行其它程序接口 携带参数访问接口 前言 有时候会想着开个一个接口来访问试试&#xff0c;这里就给出一个基础接口代码示例 代码实现 导入Flask模块&#xff0c;没安装Flask 模块需要进行 安装&#xff1a;pip install flask 使用镜…...

Vue3 toRef函数和toRefs函数

当我们在setup 中的以读取对象属性单独交出去时&#xff0c;我们会发现这样会丢失响应式&#xff1a; setup() {let person reactive({name: "张三",age: 18,job: {type: "前端",salary:10}})return {name: person.name,age: person.age,type: person.jo…...

【论文阅读】(VAE-GAN)Autoencoding beyond pixels using a learned similarity metric

论文地址;[1512.09300] Autoencoding beyond pixels using a learned similarity metric (arxiv.org) / 一、Introduction 主要讲了深度学习中生成模型存在的问题&#xff0c;即常用的相似度度量方式&#xff08;使用元素误差度量&#xff09;对于学习良好的生成模型存在一定…...

verilog之wire vs reg区别

文章目录 一、wire vs reg二、实例一、wire vs reg wire线网: 仅支持组合逻辑建模必须由assign语句赋值不能在always块中驱动用于连接子模块的输出用于定义模块的输入端口reg寄存器: 可支持组合逻辑或时序逻辑建模必须在always块中赋值二、实例 wire [7:0] cnt; assign cnt …...

力扣面试经典150题详细解析

刷题的初心 众所周知&#xff0c;算法题对于面试大厂是必不可缺的一环&#xff0c;而且对于提高逻辑思维能力有着不小的提升。所以&#xff0c;对于程序员来讲&#xff0c;无论刚入行&#xff0c;还是从业多年&#xff0c;保持一个清醒的头脑&#xff0c;具备一个良好的设计思…...

AI辅助开发:模仿PS创意效果,用快马生成智能艺术风格迁移应用代码

最近在做一个艺术风格迁移的小项目&#xff0c;正好用到了InsCode(快马)平台的AI辅助开发功能&#xff0c;整个过程特别顺畅。这个项目的灵感来源于PS的创意效果&#xff0c;但想用更智能的方式来实现类似功能。下面分享一下我的实现思路和经验。 项目构思 最初是想做一个能让普…...

开源工具优化Cursor API调用:突破限制提升开发效率的完整方案

开源工具优化Cursor API调用&#xff1a;突破限制提升开发效率的完整方案 【免费下载链接】cursor-free-vip [Support 0.45]&#xff08;Multi Language 多语言&#xff09;自动注册 Cursor Ai &#xff0c;自动重置机器ID &#xff0c; 免费升级使用Pro 功能: Youve reached y…...

SinricPro Business SDK:面向量产的ESP32物联网固件开发套件

1. SinricPro Business SDK 概述SinricPro Business SDK 是专为商业化物联网产品设计的嵌入式软件开发套件&#xff0c;其核心定位并非面向 hobbyist 的快速演示工具&#xff0c;而是面向量产级硬件产品的固件基础设施。与社区版 SinricPro SDK 不同&#xff0c;Business SDK 在…...

避坑指南:在FPGA上实现DP SST协议时,最容易搞错的BS/SR时序与填充规则

FPGA实战避坑&#xff1a;DP SST协议中BS/SR时序与填充规则的7个致命误区 DisplayPort单流传输(SST)协议在FPGA实现过程中&#xff0c;那些看似简单的BS(Blanking Start)和SR(Scrambler Reset)时序规则&#xff0c;往往成为视频流异常的罪魁祸首。去年在为某8K视频采集卡调试DP…...

看完就会:高效论文写作全流程AI论文平台推荐(2026 最新)

论文写作全流程可拆解为文献调研→选题/开题→大纲/初稿→文献综述→降重/去AI味→润色/格式→查重/投稿七大环节&#xff0c;以下2026年AI论文平台按环节精准匹配&#xff0c;兼顾中文适配、降重能力、去AI痕迹、学术合规四大核心需求&#xff0c;覆盖免费/付费、通用/垂直场景…...

Claude 90分钟挖穿20年漏洞!5w星“安全”系统跌下神坛,Linux内核也未能幸免

鹭羽 发自 凹非寺量子位 | 公众号 QbitAIGitHub狂揽5w星、以安全著称的Ghost CMS&#xff0c;刚刚跌下了神坛。只因Anthropic的研究员给Claude下达了一个指令——找出系统漏洞。结果90分钟&#xff0c;精准定位Ghost CMS首个高危漏洞&#xff0c;并在无身份验证的情况下窃取到管…...

双目立体视觉实战:从平行视图到3D电影原理的完整解析

双目立体视觉实战&#xff1a;从平行视图到3D电影原理的完整解析 你是否曾在电影院戴上3D眼镜&#xff0c;被扑面而来的立体效果震撼&#xff1f;这种身临其境的视觉体验&#xff0c;其核心技术正是源于双目立体视觉原理。本文将带你深入探索从平行视图构建到3D电影实现的完整技…...

筑牢数据安全底座!百度智能云数据库GaiaDB分布式版通过『国密认证』

近日&#xff0c;百度智能云自研的关系型数据库GaiaDB分布式版获得由国家密码管理局商用密码检测认证中心颁发的《商用密码产品认证证书》&#xff0c;通过GM/T 0028《密码模块安全技术要求》安全等级第二级认证。这一认证标志着GaiaDB分布式版密码模块在密码安全设计、密钥管理…...

7个技巧彻底改变你的Mac菜单栏体验:Ice终极配置指南

7个技巧彻底改变你的Mac菜单栏体验&#xff1a;Ice终极配置指南 【免费下载链接】Ice Powerful menu bar manager for macOS 项目地址: https://gitcode.com/GitHub_Trending/ice/Ice Ice是一款强大的macOS菜单栏管理工具&#xff0c;专门帮助用户整理杂乱的菜单栏图标&…...

ESP8266轻量协程调度器:零栈LeanTask与确定性多任务设计

1. 项目概述ESP8266Scheduler 是一个专为 ESP8266 平台设计的协作式多任务调度器&#xff08;Co-operative Multitasking Scheduler&#xff09;&#xff0c;其核心目标是在资源受限的 Wi-Fi SoC 上实现轻量、确定、可预测的任务并发执行模型&#xff0c;同时避免传统抢占式 RT…...