Vue基础知识:Vue3.3出现的defineOptions,如何使用,解决了什么问题?

1.那么为什么会出现defineOptions?

原因说明:

有<script setup></script>语法糖应用之前,如果要定义 props,emits 可以轻而易举地添加一个与 setup 平级的属性。但是用了<script setup>后,就没法这么干了整个被 setup语法糖套了,setup 属性已经没有了,自然无法添加与其平级的属性。

如果不用setup的话,可以添加许多平级的属性。如图所示

但是用了setup语法糖就无法添加同级属性了,只能用编译器宏,defineExpose、defineEmit......

为了解决这一问题,引入了 defineProps 与 defineEmits 这两个宏。但这只解决了 props 与 emits 这两个属性,。如果我们要定义组件的 name 或其他自定义的属性,还是得回到最原始的用法--再添加一个普通的 <script>标签,这样就会存在两个<script>标签。让人无法接受,如图所示:

所以在 Vue 3.3 中新引入了 defineOptions 宏。顾名思义,主要是用来定义 0ptions APl的选项。可以用defineOptions 定义任意的选项, props,emits,expose,slots 除外(因为这些可以使用 defineXXX 来做到)

2.下面进行案例演示:

 

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

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

相关文章

成长过程,摔倒不要紧,爬起来、改过、前进

无论何时何地&#xff0c;我们都有重头再来的能力&#xff0c;这份生生不息的力量来自天之灵根&#xff1b; 学习过程会有跌倒&#xff0c;这是很正常的节奏次序&#xff0c;不能掩盖自己的过失、自欺欺人&#xff0c;这不是过失&#xff0c;摔倒了就拍拍身上的灰尘&#xff…

算法题:用JS实现删除链表的倒数第N个节点

学习目标&#xff1a; 删除链表的倒数第N个节点 leetcode原题链接 学习内容&#xff1a; 给你一个链表&#xff0c;删除链表的倒数第 n 个结点&#xff0c;并且返回链表的头结点 示例 1: 输入&#xff1a;head [1,2,3,4,5], n 2 输出&#xff1a;[1,2,3,5] 示例 2: 输入&a…

谷粒商城学习笔记-2-分布式组件-SpringCloud Alibaba-Nacos注册中心

文章目录 一&#xff0c;Nacos简介1&#xff0c;简介2&#xff0c;Nacos原理剖析 二&#xff0c;Nacos服务端安装1&#xff0c;下载 nacos-server2&#xff0c;解压启动nacos-server3&#xff0c;验证 三&#xff0c;服务注册步骤1&#xff0c;引用Nacas客户端的Jar包2&#xf…

c++之命名空间详解(namespace)

引例 在学习之前我们首先了来看这样一个情形: 在c语言下&#xff0c;我们写了两个头文件&#xff1a;链表和顺序表的。我们会定义一个type(typedef int type)方便改变数据类型&#xff08;比如将int改成char&#xff09;&#xff0c;来做到整体代换。 但是我们两个头文件里面…

python实现接口自动化

代码实现自动化相关理论 代码编写脚本和工具实现脚本区别是啥? 代码&#xff1a; 优点&#xff1a;代码灵活方便缺点&#xff1a;学习成本高 工具&#xff1a; 优点&#xff1a;易上手缺点&#xff1a;灵活度低&#xff0c;有局限性。 总结&#xff1a; 功能脚本&#xff1a;工…

【C++】BMP图片结构深度解析及其在C++中的操作与应用

引言 BMP&#xff08;Bitmap Image File&#xff09;是一种与设备无关的图像文件格式&#xff0c;它采用了一种非常直接的方式来存储图像数据&#xff0c;即按照图像的行和列顺序&#xff0c;逐像素地存储颜色值。由于其简单性和可移植性&#xff0c;BMP文件在图像处理、图像分…

windows电脑桌面便签在哪里找?

在忙碌的工作中&#xff0c;我们经常会有很多事情需要记住。这时&#xff0c;电脑桌面便签就成为了我们的好帮手。那么&#xff0c;在Windows电脑上&#xff0c;我们该如何找到桌面便签呢&#xff1f;下面&#xff0c;就让我来为大家详细介绍一下。 其实&#xff0c;Windows电…

告别盲目跟风!1688竞品数据分析实战指南(图文解析)

不管是哪个行业&#xff0c;想把这个做起来&#xff0c;做下去&#xff0c;第一就要学会模仿&#xff0c;不要自己盲目瞎做&#xff0c;因为别人的数据&#xff0c;都是得到了认可的&#xff0c;先模仿后超越&#xff0c;1688运营里面模仿就是要学会看竞品&#xff0c;店雷达总…

基于AD8232的心电图套件的测试

基于AD8232的心电图套件的测试 1、测试设备2、电源的选择3、 用于测试心电图套件的模拟心电图电路基本4017B的电路基于multisim的电路仿真基于STM32F103RCT6 参考测试数据 1、测试设备 1、AD8232心电模块 2、手持示波器 3、心电信号模拟发生器 4、NI multisim 14.3 5、实物待补…

django后台定制

Django 后台&#xff08;Admin&#xff09;是一个强大的工具&#xff0c;用于管理 Django 项目中的数据模型。然而&#xff0c;默认的 Django Admin 可能无法满足所有项目的需求&#xff0c;因此经常需要进行定制。以下是一些关于 Django 后台定制的推荐、介绍以及技术实现的建…

全卷积网络之FCN图像语义分割

前言 FCN是一种用于图像语义分割的全卷积网络&#xff0c;可以端到端进行像素级预测。 语义分割 图像语义分割是图像处理和机器视觉技术中的重要一环&#xff0c;旨在对图像中的每个像素进行分类。与普通的分类任务不同&#xff0c;语义分割任务输出与输入大小相同的图像&…

鸿蒙语言基础类库:【@ohos.uri (URI字符串解析)】

URI字符串解析 说明&#xff1a; 本模块首批接口从API version 8开始支持。后续版本的新增接口&#xff0c;采用上角标单独标记接口的起始版本。开发前请熟悉鸿蒙开发指导文档&#xff1a;gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md点击或者复制转到。 导入…

亿康源精英盛宴暨亿康源启动成功举办

&#xff08;本台记者报&#xff09;2024年7月7日下午&#xff0c;亿康源精英盛宴暨启动仪式在杭州市中维歌德大酒店盛大举行。此次盛会不仅吸引了行业内的专业人才、著名投资界大咖和科技领域的杰出企业家&#xff0c;还汇聚了众多关注大健康产业的各界人士&#xff0c;共同见…

软件设计之Java入门视频(13)

软件设计之Java入门视频(13) 视频教程来自B站尚硅谷&#xff1a; 尚硅谷Java入门视频教程&#xff0c;宋红康java基础视频 相关文件资料&#xff08;百度网盘&#xff09; 提取密码&#xff1a;8op3 idea 下载可以关注 软件管家 公众号 学习内容&#xff1a; 该视频共分为1-7…

【在线词典】项目实现

15_Dictionary 在线词典 搭建客户端-服务器架构 准备必要的资源 整理原始数据 整理英汉双语对照表&#xff0c;将XLSX格式转换成CSV格式&#xff0c;准备好vocabulary_list.csv文件备用 注意&#xff1a;CSV格式的文件必须使用UTF-8的字符集&#xff1b; 建立mydatabase.…

SCI三区|儿童学习优化算法KLO:基于社会进化和认知学习的优化算法

目录 1.背景2.算法原理2.1算法思想2.2算法过程 3.结果展示4.参考文献5.代码获取 1.背景 2024年&#xff0c;ST Javed受到社会环境下家庭儿童的早期社会学习行为启发&#xff0c;提出了儿童学习优化算法&#xff08;Kids Learning Optimizer, KLO&#xff09;。 2.算法原理 2.…

珍藏多年的计算机内核结构大全笔记,掌握计算机工作原理真不难

本篇会加入个人的所谓鱼式疯言 ❤️❤️❤️鱼式疯言:❤️❤️❤️此疯言非彼疯言 而是理解过并总结出来通俗易懂的大白话, 小编会尽可能的在每个概念后插入鱼式疯言,帮助大家理解的. &#x1f92d;&#x1f92d;&#x1f92d;可能说的不是那么严谨.但小编初心是能让更多人…

江洲的《家书》,岂止抵万金

题记 今晨6点钟&#xff0c;像往日一样的背上鱼具包&#xff0c;欲驾乘清凉舒适的晨风&#xff0c;前往味江河堤享受钓翁乐趣。孰料开门一看&#xff0c;朦胧的天空竟下着淅淅沥沥的小雨。 今年的天气异常&#xff0c;是笔者寄居“西川第一天”古镇5年来所未见&#xff1a;再…

顺序表实现

size属于结构体的作用域 如果要访问一个结构体的指针用-> 如果要访问一个结构体的变量用. 点操作 #include<stdio.h> #include<stdlib.h> #include<string.h> #include"seqlist.h" //typedef struct seqList{ // SLDataType* _data; //需…

CSS技巧 - 一日一例 (1):会讨好的热情按钮

题外话: 从今天开始,我准备开设一个新的专栏,专门写 使用CSS实现各种酷炫按钮的方法,本专栏目前准备写40篇左右,大概会完成如下按钮效果: 今天,我来介绍第一个按钮的实现方法:会讨好的热情按钮。为什么我给它起这样的名字呢?你看它像不像一个不停摇尾巴的小黄?当你鼠…