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

vue3:5、组合式API-reactive和ref函数

 

<script setup>
/*
reactive接收一个对象类型的数据,返回一个响应式的对象
*//*** ref:接收简单类型或复杂类型,返回一个响应式对象* 本质:是在原有传入数据的基础上,外层报了一层对象,包成了复杂类型* 底层:包成复杂类型之后,再借助reactive实现了的响应式* 注意点:* 1、脚本中访问数据,需要通过.vue* 2、在template中,.vue不需要加(帮我们扒了一层)* *//*** 推荐:以后声明数据,统一用ref*/
import { reactive, ref } from "vue";
const state = reactive({count :100
})const count= ref(0)const setCount = ()=>{state.count++count.value ++
}</script>
<template><div><div>reactive{{ state.count }}</div><div>ref {{ count }}</div><button @click="setCount">+1</button></div>
</template>

相关文章:

vue3:5、组合式API-reactive和ref函数

<script setup> /* reactive接收一个对象类型的数据&#xff0c;返回一个响应式的对象 *//*** ref:接收简单类型或复杂类型&#xff0c;返回一个响应式对象* 本质&#xff1a;是在原有传入数据的基础上&#xff0c;外层报了一层对象&#xff0c;包成了复杂类型* 底层&…...

Unity Inspector面板上显示Api

serializeField】——将私有类型和保护类型可视化到面板上【System.serializeField】——将自定义类型可视化到面板上【HideIninspector】——将公共变量隐藏【Header&#xff08;“分组说明”&#xff09;】——将可视化变量进行分组【Tooltip&#xff08;“内容说明”&#x…...

Redis功能实战篇之附近商户

在互联网的app当中&#xff0c;特别是像美团&#xff0c;饿了么等app。经常会看到附件美食或者商家&#xff0c; 当我们点击美食之后&#xff0c;会出现一系列的商家&#xff0c;商家中可以按照多种排序方式&#xff0c;我们此时关注的是距离&#xff0c;这个地方就需要使用到我…...

selenium 自动化测试——元素定位

WebDriver 提供了8种元素的定位方法&#xff0c;分别是&#xff1a; id 定位&#xff1a;find_element(By.ID, "kw") name 定位: find_element(By.NAME, "") tag 定位: find_element(By.TAG, "") class 定位: find_element(By.CLASS_NAME, &quo…...

【JMeter】 二次开发插件开发 Dubbo 接口测试插件浅析

概述 在一些企业中&#xff0c;各类业务系统非常丰富&#xff0c;相互之间或对外提供很多的服务或接口这些服务或接口中&#xff0c;有很多是需要强契约约束的&#xff0c;服务的提供方、服务的使用方必须遵守相同契约这类服务最典型的就是RPC&#xff0c;其中应用广泛的有Dub…...

手机SSL证书认证失败是什么意思?

手机SSL证书认证失败是指在使用手机设备浏览网站时&#xff0c;由于SSL证书的认证问题&#xff0c;导致无法建立安全的加密连接。本文将详细介绍手机SSL证书认证失败的含义、可能的原因以及解决方法&#xff0c;帮助用户了解并解决该问题&#xff0c;以确保手机端浏览的数据传输…...

PXE网络批量装机(centos7)

目录 前言 一、实验拓扑图 二、PXE的组件 三、配置PXE装机服务器 1、设置防火墙、selinux 2.安装、启动vsftp 3、拷贝系统文件到/var/ftp用于装机 4、配置tftp 5、准备pxelinx.0文件、引导文件、内核文件 6、配置本机IP 7、配置DHCP服务 8、创建default文件 四、配…...

P1104 生日

题目描述 cjf 君想调查学校 OI 组每个同学的生日&#xff0c;并按照年龄从大到小的顺序排序。但 cjf 君最近作业很多&#xff0c;没有时间&#xff0c;所以请你帮她排序。 输入格式 输入共有 n 1 n 1 n1 行&#xff0c; 第 1 1 1 行为 OI 组总人数 n n n&#xff1b; …...

计算机网络复习大纲

第一章 计算机网络概述 一&#xff0c;网络发展的形态 了解&#xff1a;当前网络的组成形态&#xff1a; 二&#xff0c;计算机网络的定义 掌握 网络的物理组成实体 网络的工作方式 网络组建的目的 三&#xff0c;通过网络定义 我们如何学习网络 物理实体如何构成&…...

Linux:进程(概念)

学习目标 1.认识冯诺依曼系统 2.认识操作系统概念与定位 (系统调用接口) 3.理解进程的概念&#xff08;PCB&#xff09; 4.理解进程的状态&#xff08;fork创建进程&#xff0c;僵尸进程及孤儿进程&#xff09; 5.了解进程的调度&#xff08;优先级&#xff0c;竞争性&#xff…...

智能机器人:打造自动化未来的关键技术

文章目录 1. 智能机器人的基本概念2. 智能机器人的关键技术2.1 机器视觉2.2 机器学习与深度学习2.3 传感器技术 3. 智能机器人的应用领域3.1 制造业3.2 医疗保健3.3 农业3.4 服务业 4. 智能机器人的未来趋势4.1 自主决策能力的提升4.2 协作与互操作性4.3 个性化定制4.4 环境感知…...

大数据(七):Pandas的基础应用详解(四)

专栏介绍 结合自身经验和内部资料总结的Python教程,每天3-5章,最短1个月就能全方位的完成Python的学习并进行实战开发,学完了定能成为大佬!加油吧!卷起来! 全部文章请访问专栏:《Python全栈教程(0基础)》 再推荐一下最近热更的:《大厂测试高频面试题详解》 该专栏对…...

【1day】​万户协同办公平台 ezoffice未授权访问漏洞学习

注:该文章来自作者日常学习笔记,请勿利用文章内的相关技术从事非法测试,如因此产生的一切不良后果与作者无关。 目录...

适配器模式:如何让不兼容的接口变得兼容

在软件开发中&#xff0c;我们经常会遇到这样的情况&#xff1a;我们需要使用一个现有的类或者接口&#xff0c;但它与我们系统的目标接口不兼容&#xff0c;而我们又不能修改它。这时候&#xff0c;我们该怎么办呢&#xff1f;大多数情况下我们都可以使用适配器模式来解决这个…...

sentinel熔断报java.lang.reflect.UndeclaredThrowableException

背景&#xff1a;内部要进行应用jdk&springboot升级&#xff0c;因此也需要将Spring Cloud Hystrix 替换成alibaba sentinel。 依赖 <dependency><groupId>com.alibaba.cloud</groupId><artifactId>spring-cloud-starter-alibaba-sentinel</a…...

工业4G路由器的户外组网与无人值守场景应用

工业4G路由器是专为不便电缆布线的工业或日晒雨淋网络不畅的户外环境所设计的网络设备。它能够在没有光纤宽带的情况下使用插卡的方式提供4G或无线WiFi的网络支持。具备工业级防水功能&#xff0c;能够在户外环境下进行网络部署&#xff0c;并实现无人值守运行。工业4G路由器还…...

中移粤港澳大湾区创新研究院、南湖研究院类脑实验室面试(部分)

中移粤港澳大湾区创新研究院 reids热key的高并发量&#xff0c;导致此redis节点的cpu使用率爆满&#xff0c;有什么优化方案&#xff1f;高并发情况下为了保证平台正常运行&#xff0c;怎么设置平台的监控和告警 南湖研究院类脑实验室 笔试通过后&#xff0c;面试无后续...

API 自动化测试难点总结与分享

API自动化测试的难点包括&#xff1a; 接口的参数组合较多&#xff0c;需要覆盖各种可能的情况。接口的状态和数据关联较多&#xff0c;需要验证返回结果是否符合预期。接口的并发访问和性能测试较为复杂&#xff0c;需要合理规划和调度测试策略。接口的安全性和权限控制较为重…...

【每日一题】补档 ABC309F - Box in Box | 三维偏序 | 树状数组 | 中等

题目内容 原题链接 给定 n n n 个箱子&#xff0c;问是否存在一个箱子 x x x 是否可以放到另一个箱子 y y y 里。 需要满足 h x < h y , w x < w y , d x < d y h_x<h_y,w_x<w_y,d_x<d_y hx​<hy​,wx​<wy​,dx​<dy​。 箱子可以随意翻转。 …...

异步编程 - 13 高性能线程间消息传递库 Disruptor

文章目录 Disruptor概述Disruptor中的核心术语Disruptor 流程图 Disruptor的特性详解基于Disruptor实现异步编程 Disruptor概述 Disruptor是一个高性能的线程间消息传递库&#xff0c;它源于LMAX对并发性、性能和非阻塞算法的研究&#xff0c;如今构成了其Exchange基础架构的核…...

Admin.Net中的消息通信SignalR解释

定义集线器接口 IOnlineUserHub public interface IOnlineUserHub {/// 在线用户列表Task OnlineUserList(OnlineUserList context);/// 强制下线Task ForceOffline(object context);/// 发布站内消息Task PublicNotice(SysNotice context);/// 接收消息Task ReceiveMessage(…...

云启出海,智联未来|阿里云网络「企业出海」系列客户沙龙上海站圆满落地

借阿里云中企出海大会的东风&#xff0c;以**「云启出海&#xff0c;智联未来&#xff5c;打造安全可靠的出海云网络引擎」为主题的阿里云企业出海客户沙龙云网络&安全专场于5.28日下午在上海顺利举办&#xff0c;现场吸引了来自携程、小红书、米哈游、哔哩哔哩、波克城市、…...

为什么需要建设工程项目管理?工程项目管理有哪些亮点功能?

在建筑行业&#xff0c;项目管理的重要性不言而喻。随着工程规模的扩大、技术复杂度的提升&#xff0c;传统的管理模式已经难以满足现代工程的需求。过去&#xff0c;许多企业依赖手工记录、口头沟通和分散的信息管理&#xff0c;导致效率低下、成本失控、风险频发。例如&#…...

在 Nginx Stream 层“改写”MQTT ngx_stream_mqtt_filter_module

1、为什么要修改 CONNECT 报文&#xff1f; 多租户隔离&#xff1a;自动为接入设备追加租户前缀&#xff0c;后端按 ClientID 拆分队列。零代码鉴权&#xff1a;将入站用户名替换为 OAuth Access-Token&#xff0c;后端 Broker 统一校验。灰度发布&#xff1a;根据 IP/地理位写…...

五年级数学知识边界总结思考-下册

目录 一、背景二、过程1.观察物体小学五年级下册“观察物体”知识点详解&#xff1a;由来、作用与意义**一、知识点核心内容****二、知识点的由来&#xff1a;从生活实践到数学抽象****三、知识的作用&#xff1a;解决实际问题的工具****四、学习的意义&#xff1a;培养核心素养…...

WordPress插件:AI多语言写作与智能配图、免费AI模型、SEO文章生成

厌倦手动写WordPress文章&#xff1f;AI自动生成&#xff0c;效率提升10倍&#xff01; 支持多语言、自动配图、定时发布&#xff0c;让内容创作更轻松&#xff01; AI内容生成 → 不想每天写文章&#xff1f;AI一键生成高质量内容&#xff01;多语言支持 → 跨境电商必备&am…...

拉力测试cuda pytorch 把 4070显卡拉满

import torch import timedef stress_test_gpu(matrix_size16384, duration300):"""对GPU进行压力测试&#xff0c;通过持续的矩阵乘法来最大化GPU利用率参数:matrix_size: 矩阵维度大小&#xff0c;增大可提高计算复杂度duration: 测试持续时间&#xff08;秒&…...

聊一聊接口测试的意义有哪些?

目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开&#xff0c;首…...

selenium学习实战【Python爬虫】

selenium学习实战【Python爬虫】 文章目录 selenium学习实战【Python爬虫】一、声明二、学习目标三、安装依赖3.1 安装selenium库3.2 安装浏览器驱动3.2.1 查看Edge版本3.2.2 驱动安装 四、代码讲解4.1 配置浏览器4.2 加载更多4.3 寻找内容4.4 完整代码 五、报告文件爬取5.1 提…...

SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理)

上一章用到了V2 的概念&#xff0c;其实 Fiori当中还有 V4&#xff0c;咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务)&#xff0c;代理中间件&#xff08;ui5-middleware-simpleproxy&#xff09;-CSDN博客…...