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

【vue3】基础知识点-setup语法糖

学习vue3,都会从基础知识点学起。了解setup函数,ref,recative,watch、comptued、pinia等如何使用

今天说vue3组合式api,setup函数
在学习过程中一开始接触到的是这样的,定义数据且都要通过return返回

<script>
export default {
setup(){
cosnt message = 'new day
const logMessage= ()=>{
console.log(message)
}
return {
message,
logMessage
}
}
}
</script>

最新接触到的是这样的

<script setup>
cosnt message = 'new day
const logMessage= ()=>{
console.log(message)
}
</script>

两种不同的写法,那区别是什么呢?

其实在script标签上直接加setup就是语法糖写法

语法糖写法,简单理解就是经过一定的封装,将之前复杂的写法变成一个简单的写法

原先的export default 、setup(){} ,return 都不需要写了

官方提供了一个工具,可以在线看实际运行后的代码

戳这里,跳转到vue SFC Playground官方工具

示例图
看右侧实际运行的代码,是同之前的复杂写法的。在底层运行的时候还是一开始的复杂写法,只是通过封装,提供给我们一个简单的写法,这就是语法糖的意义。

相关文章:

【vue3】基础知识点-setup语法糖

学习vue3&#xff0c;都会从基础知识点学起。了解setup函数&#xff0c;ref&#xff0c;recative&#xff0c;watch、comptued、pinia等如何使用 今天说vue3组合式api&#xff0c;setup函数 在学习过程中一开始接触到的是这样的&#xff0c;定义数据且都要通过return返回 <…...

idol!! 2023牛客暑期多校训练营6 C

登录—专业IT笔试面试备考平台_牛客网 题目大意&#xff1a;定义n!!等于与n的奇偶性相同的所有小于等于n的数的阶乘之和&#xff0c;问n!!的末尾有多少0 1<n<1e18 思路&#xff1a;因为末尾0的来源是2*5&#xff0c;而2的个数明显比5的个数多得多&#xff0c;所以末尾…...

深入理解Jdk5引入的Java泛型:类型安全与灵活性并存

深入理解Jdk5引入的Java泛型&#xff1a;类型安全与灵活性并存 ​ 在Java的中&#xff0c;有一个强大的工具&#xff0c;它可以让你在编写代码时既保持类型安全&#xff0c;又享受灵活性。**这个工具就是——泛型&#xff08;Generics&#xff09;。**本文将引导你深入了解Java…...

idea在控制台中输出文字显示乱码

VM options中加入下面这行 -Dfile.encodingutf-8...

hacksudo3 通关详解

环境配置 一开始桥接错网卡了 搞了半天 改回来就行了 信息收集 漏洞发现 扫个目录 大概看了一眼没什么有用的信息 然后对着login.php跑了一下弱口令 sqlmap 都没跑出来 那么利用点应该不在这 考虑到之前有过dirsearch字典太小扫不到东西的经历 换个gobuster扫一下 先看看g…...

CentOS 虚拟机磁盘扩容(非常实用)

新手村的选手在刚开始安装使用 CentOS 虚拟机时&#xff0c;很多选项都会按照推荐操作来&#xff0c;比如&#xff1a;磁盘推荐大小为 20 GB&#xff1b;但随着后面的使用&#xff0c;总会因为“磁盘根目录不足”原因&#xff0c;而导致软件无法安装、虚拟机无法正常运行等&…...

docker案例复现

$uri导致的CRLF注入漏洞 前期准备dockerdocker compose 漏洞配置 前期准备 docker 要完成这样的测试&#xff0c;需要我们有一定的环境&#xff0c;也就是需要大家去安装docker 更新系统软件包&#xff1a; sudo yum update 安装 Docker 的依赖软件包&#xff1a; sudo yum …...

淘宝资源采集(从零开始学习淘宝数据爬取)

1. 为什么要进行淘宝数据爬取&#xff1f; 淘宝数据爬取是指通过自动化程序从淘宝网站上获取数据的过程。这些数据可以包括商品信息、销售数据、评论等等。淘宝数据爬取可以帮助您了解市场趋势、优化您的产品选择以及提高销售额。 淘宝作为全球的电商平台&#xff0c;每天都有…...

【C语言】预处理详解

本文目录 1 预定义符号 2 #define 2.1 #define 定义标识符 2.2 #define 定义宏 2.3 #define 替换规则 2.4 #和## 2.5 带副作用的宏参数 2.6 宏和函数对比 2.7 命名约定 3 #undef 4 命令行定义 5 条件编译 6 文件包含 6.1 头文件被包含的方式 6.2 嵌套文件包含 1 预定义符号 __…...

2023中国(合肥)场景创新峰会成功举办,全息网御被纳入《合肥市第二批场景能力清单》

场景作为重要的城市资源&#xff0c;在驱动科技创新、产业发展、城市治理方面发挥着重要作用。近年来&#xff0c;为促进数字技术与实体经济深度融合&#xff0c;加速前沿科技转化落地、吸引全球创新资源集聚&#xff0c;合肥市聚焦“双找”&#xff1a;为产品找场景&#xff0…...

QT QLCDNumber 使用详解

本文详细的介绍了QLCDNumber控件的各种操作&#xff0c;例如&#xff1a;新建界面、源文件、设置显示位数、设置进制、设置外观、设置小数点、设置溢出、显示事件、其它文章等等操作。 实际开发中&#xff0c;一个界面上可能包含十几个控件&#xff0c;手动调整它们的位置既费时…...

明年,HarmonyOS不再兼容Android应用!

2023年华为开发者大会&#xff0c;不知道各位老铁们是否观看了&#xff0c;一个震撼的消息就是&#xff0c;首次公开了HarmonyOS NEXT的概念&#xff0c;简而言之就是&#xff0c;这是一款专为开发者打造的预览版操作系统&#xff0c;旨在提供"纯正鸿蒙操作系统"的体…...

华为OD机试 - 人气最高的店铺(Java JS Python)

题目描述 某购物城有m个商铺,现决定举办一场活动选出人气最高店铺。 活动共有n位市民参与,每位市民只能投一票,但1号店铺如果给该市民发放 q 元的购物补贴,该市民会改为投1号店铺。 请计算1号店铺需要最少发放多少元购物补贴才能成为人气最高店铺(即获得的票数要大于其…...

mysql sql 语句sum求和嵌套数学表达式

今天有个需求, 已减高度 高度 x 单双开(单开1 双开2) x 2,要直接写在sql语句中。 表字段 包含 高度 和 单双开字段 值是字符串 (双开 左单开 右单开) -- 已减高度 2 * 单双开 * 高度 sum( -- 求和 表达式 已减高度 2 * 单双开 * 高度 t_cloth.hegiht * 2 * (case WHEN l…...

Java课题笔记~ Servlet编程

1.Servlet编程基础 (1)什么是Servlet Servlet是基于Java语言的Web编程技术&#xff0c;部署在服务器端的Web容器里&#xff0c;获取客户端的访问请求&#xff0c;并根据请求生成响应信息返回给客户端。 创建Servlet的方式&#xff0c;有 如下图&#xff1a;一般创建Servlet都…...

修改IDEA的idea.vmoptions参数导致IDEA无法打开(ReservedCodeCacheSize)

事发原因 Maven导依赖的时候OOM&#xff0c;因此怀疑是内存太小&#xff0c;尝试修改idea.vmoptions的参数&#xff0c;然后发现IDEA重启后打不开了&#xff0c;卸载重装后也无法打开。。。 实际上如果导包爆出OOM的话应该调整下图参数&#xff0c;不过这都是后话了 解决思路…...

P1321 单词覆盖还原

题目描述 一个长度为 l l l 的字符串中被反复贴有 boy 和 girl 两单词&#xff0c;后贴上的可能覆盖已贴上的单词&#xff08;没有被覆盖的用句点表示&#xff09;&#xff0c;最终每个单词至少有一个字符没有被覆盖。问贴有几个 boy 几个 girl&#xff1f; 输入格式 一行被…...

GODOT游戏引擎简介,包含与unity性能对比测试,以及选型建议

GODOT&#xff0c;是一个免费开源的3D引擎。本文以unity作对比&#xff0c;简述两者区别和选型建议。由于是很久以前写的ppt&#xff0c;技术原因视频和部分章节丢失了。建议当做业务参考。 GODOT目前为止遇到3个比较重大的基于&#xff0c;第一个是oprea的合作奖&#xff0c;…...

Add-in Express for Microsoft Office and Delphi Crack

Add-in Express for Microsoft Office and Delphi Crack 适用于Microsoft Office和Delphi VCL的Add-in Express使您能够在几次点击中为Microsoft Office开发专业插件。它生成基于COM的项目&#xff0c;这些项目包含Microsoft Office外接程序或智能标记的所有必要功能&#xff0…...

opencv基础-34 图像平滑处理-2D 卷积 cv2.filter2D()

2D卷积是一种图像处理和计算机视觉中常用的操作&#xff0c;用于在图像上应用滤波器或卷积核&#xff0c;从而对图像进行特征提取、平滑处理或边缘检测等操作。 在2D卷积中&#xff0c;图像和卷积核都是二维的矩阵或数组。卷积操作将卷积核在图像上滑动&#xff0c;对每个局部区…...

SkeyeVSS开发心得-VSS流播放与注意事项

本文是 VSS流播放详解 的配套开发笔记。 项目地址 https://github.com/openskeye/go-vss 1. 明确三个要点 POST /api/video/stream 只有一套 StreamResp 外壳&#xff0c;内里走哪路完全由 Device.AccessProtocol 决定。流媒体是否拉起来&#xff0c;不都是 StartRelyPull 的…...

【AI】可以操控鼠标的智能体

2026-04-02&#xff0c;以下是当前&#xff08;截至2026年初&#xff09;可以操作鼠标的AI智能体最新格局&#xff0c;分为操作系统级控制&#xff08;真鼠标键盘控制&#xff09;和浏览器级控制两类&#xff1a;第一梯队&#xff1a;操作系统级鼠标控制&#xff08;全桌面操控…...

嵌入式轻量级数值优化库:面向MCU的确定性参数寻优方案

1. 项目概述Optimization 是一个面向嵌入式平台的轻量级数值优化库&#xff0c;专为 Arduino 及兼容 MCU&#xff08;如 STM32、ESP32、nRF52 等&#xff09;设计&#xff0c;其核心目标是在资源受限环境下&#xff0c;对用户定义的单目标标量函数 f(x₁, x₂, ..., xₙ) 进行参…...

为什么28S与18S rRNA比值可用于评估RNA质量?

在分子生物学实验中&#xff0c;获得高质量RNA样本是基因表达分析、转录组测序等研究成功的关键前提。在众多RNA质量评估方法中&#xff0c;28S与18S核糖体RNA的比值长期被广泛用作实验室中的“黄金标准”。这一标准为何如此受重视&#xff1f;其背后有着明确的原理与判断依据。…...

扩散模型对抗样本经典baselines

1. 流图&#xff1a;数据的河流 如果把传统的堆叠面积图想象成一块块整齐堆叠的积木&#xff0c;那么流图就像一条蜿蜒流淌的河流&#xff0c;河道的宽窄变化自然流畅&#xff0c;波峰波谷过渡平滑。 它特别适合展示多个类别数据随时间的变化趋势&#xff0c;尤其是当你想强调整…...

Arduino I²C pH传感器库:高鲁棒性嵌入式pH测量方案

1. 项目概述 iarduino_I2C_pH 是一款专为 iArduino 系列 IC 接口 pH 传感器模块设计的 Arduino 兼容 C 库。该库面向嵌入式硬件工程师与固件开发者&#xff0c;提供对 pH-метр&#xff08;pH 计&#xff09;模块的完整底层控制能力&#xff0c;支持标准硬件 IC 外设&#…...

Azure IoT Hub AMQP传输层深度解析与嵌入式实践

1. Azure IoT Hub AMQP 传输层技术深度解析Azure IoT Hub 是微软面向物联网场景构建的高可靠、可扩展云平台&#xff0c;其核心能力依赖于多种协议栈的协同支持。在众多通信协议中&#xff0c;AMQP&#xff08;Advanced Message Queuing Protocol&#xff09;因其固有的消息可靠…...

BLE HID库:嵌入式设备实现HID-over-GATT的轻量级方案

1. BLE_HID 库概述&#xff1a;面向嵌入式设备的 HID-over-GATT 实现BLE_HID 是一个专为资源受限嵌入式平台设计的轻量级开源库&#xff0c;其核心目标是将传统 USB HID&#xff08;Human Interface Device&#xff09;协议栈无缝迁移至 Bluetooth Low Energy&#xff08;BLE&a…...

2026 AI 智能体工程化深度解析:从词元逻辑到高可用链路构建

进入 2026 年&#xff0c;大语言模型&#xff08;LLM&#xff09;的竞争已从单纯的“模型智力”转向了“工程化落地能力”。对于开发者而言&#xff0c;AI 不再仅仅是一个对话框&#xff0c;而是一个能够自主调用工具、处理复杂逻辑的智能体&#xff08;Agent&#xff09;。在这…...

4.1第一次练习作业

1.在root用户的主目录下创建两个目录分别为haha和hehe&#xff0c;复制hehe目录到haha目录并重命名为apple。[rootlocalhost ~]# mkdir {haha,hehe} [rootlocalhost ~]# cp -r hehe haha [rootlocalhost ~]# cd haha [rootlocalhost haha]# mv hehe apple2.将hehe目录移动到app…...