Vue中的选项式 API 和组合式 API,两者有什么区别
Vue中的选项式 API(Option API)和组合式 API(Composition API)是两种不同的组件编写方式,它们各有特点和适用场景:
-
选项式 API(Option API):
- 传统方法:Vue最初的编程范式,从Vue的早期版本开始就有。
- 结构:在一个Vue组件中,你会使用一个选项对象来组织代码,这个对象包括
data,methods,props,computed,watch,lifecycle hooks等属性。 - 特点:
- 易于理解:对于初学者来说,这种方式更加直观易懂。
- 逻辑分散:在大型组件中,相关逻辑会分散在不同的选项中,使得代码维护和理解变得复杂。
- 适用场景:适合较小或中等复杂度的应用,以及那些已经习惯于这种编程范式的Vue开发者。
-
组合式 API(Composition API):
- 新增特性:在Vue 3中引入,作为对选项式 API 的补充。
- 结构:使用
setup函数作为组件的入口点。在这个函数里,你可以使用各种组合式 API,如ref,reactive,computed,watchEffect等来构建组件逻辑。 - 特点:
- 逻辑复用:更容易在组件之间共享和复用代码。
- 更好的类型推断:为TypeScript提供了更好的支持。
- 逻辑集中:允许开发者更好地组织和管理相关的逻辑代码。
- 适用场景:适合构建大型应用和更复杂的组件,特别是当需要在多个组件之间共享逻辑时。
总结来说,选项式 API 通过一个明确的、定义好的选项对象提供了一种简洁直观的方式来组织组件代码,非常适合快速上手和小型项目。而组合式 API 提供了更高的灵活性和复用性,适合构建大型应用和复杂组件,特别是在使用TypeScript时。这两种API并不是相互排斥的,而是可以根据项目的具体需求和开发者的偏好灵活选择和结合使用。

相关文章:
Vue中的选项式 API 和组合式 API,两者有什么区别
Vue中的选项式 API(Option API)和组合式 API(Composition API)是两种不同的组件编写方式,它们各有特点和适用场景: 选项式 API(Option API): 传统方法:Vue最初的编程范式…...
Linux下误删除后的恢复操作测试之extundelete工具使用
一、工具介绍 extundelete命令的功能可用于系统删除文件的恢复。在使用前,需要先将要恢复的分区卸载,以防数据被意外覆盖。 语法格式:extundelete [参数] 文件或目录名 常用参数: --after 只恢复指定时间后被删除的文件 --bef…...
table表格中使用el-popover 无效问题解决
实例只针对单个的按钮管用在表格里每一列都有el-popover相当于是v-for遍历了 所以我们在触发按钮的时候并不是单个的触发某一个 主要执行 代码 <el-popover placement"left" :ref"popover-${scope.$index}"> 动态绑定了ref 关闭弹窗 执行deltask…...
c++类全面讲解
文章目录 前言类的基本概念基本结构类与结构体的区别示例代码 类的属性和方法属性(成员变量)方法(成员函数)访问修饰符示例代码 类的构造函数和析构函数构造函数析构函数示例代码 类的构造函数重载重载构造函数示例代码 类中的拷贝…...
使用Python和Pygame库创建简单的的彩球效果
简介 Pygame是一款强大的游戏开发库,可以用于创建各种有趣的图形效果。为了更好地了解Pygame的功能,今天我们将要做的是在屏幕上随机生成一些彩色的小球,并使它们以不同的速度和方向移动。当小球碰到屏幕边缘时,它们将反弹。 功能…...
第2课 使用FFmpeg读取rtmp流并用openCV显示视频
本课对应源文件下载链接: https://download.csdn.net/download/XiBuQiuChong/88680079 这节课我们开始利用ffmpeg和opencv来实现一个rtmp播放器。播放器的最基本功能其实就两个:显示画面和播放声音。在实现这两个功能前,我们需要先用ffmpeg连接到rtmp服…...
【中小型企业网络实战案例 七】配置限速
相关学习文章: 【中小型企业网络实战案例 一】规划、需求和基本配置 【中小型企业网络实战案例 二】配置网络互连互通【中小型企业网络实战案例 三】配置DHCP动态分配地址 【中小型企业网络实战案例 四】配置OSPF动态路由协议【中小型企业网络实战案例 五】配置可…...
Hive实战:实现数据去重
文章目录 一、实战概述二、提出任务三、完成任务(一)准备数据1、在虚拟机上创建文本文件2、上传文件到HDFS指定目录 (二)实现步骤1、启动Hive Metastore服务2、启动Hive客户端3、基于HDFS数据文件创建Hive外部表4、利用Hive SQL实…...
客户满意度调查常用的ChatGPT通用提示词模板
调查目的与范围:如何明确调查的目的和范围,确保调查的针对性? 调查方法选择:如何选择合适的调查方法,如问卷调查、访谈等? 问卷设计:如何设计问卷,确保问题的针对性和客观性&#…...
Android--Jetpack--Paging详解
不尝世间醋与墨,怎知人间酸与苦。 择一业谋食养命,等一运扭转乾坤。 你见过哪些令你膛目结舌的代码技巧? 文章目录 不尝世间醋与墨,怎知人间酸与苦。择一业谋食养命,等一运扭转乾坤。你见过哪些令你膛目结舌的代码技…...
Unity 基于UDP实现本地时间与网络时间校验 防客户端修改日期作弊
新建一个Unity GameObject 挂上NTPComponent脚本 时间校验 源码 using System.Collections; using System.Collections.Generic; using UnityEngine; using System; using UnityEngine.Networking; using System.Text; using System.Net.Sockets; using System.Net; using Sys…...
ArduPilot开源代码之MatekSys Optical Flow 3901-L0X
ArduPilot开源代码之MatekSys Optical Flow 3901-L0X 1. 源由2. 安装3. 参数配置3.1 配置光流定位3.2 配置激光测距3.3 辅助配置 4. 测试4.1 光流数据测试4.2 测距数据测试4.3 飞行注意事项4.4 实际飞行测试 5. 参考资料 1. 源由 之前介绍过MatekSys Optical Flow 3901-L0X模块…...
【时钟】分布式时钟HLC|Logical Time|Vector Clock|True Time
目录 简略 详细 附录 1 分布式系统不能使用NTP的原因 简略 分布式系统中不同于单机系统不能使用NTP(网络时间协议(Network Time Protocol))来获取时间,所以我们需要一个特别的方式来获取分布式系统中的时间,mvcc也是使用time保证读…...
人工智能AI与3D视觉技术的结合正在引领新一代移动机器人的革新
随着科技的飞速发展,人工智能AI与3D视觉技术的结合正在引领新一代移动机器人的革新。富唯智能移动机器人,以其独特的3D视觉技术,赋予了移动机器人一双“智慧之眼”,从而为现代工业自动化带来了前所未有的突破。 富唯智能移动机器…...
NSSCTF 简单包含
开启环境: 使用POST传flag,flag目录/var/www/html/flag.php 先使用post来尝试读取该flag.php 没反应: 查看一下源码index.php,看有什么条件 base64解密: <?php$path $_POST["flag"];if (strlen(file_get_contents(php://input)) <…...
FlinkSQL处理Canal-JSON数据
背景信息 Canal是一个CDC(ChangeLog Data Capture,变更日志数据捕获)工具,可以实时地将MySQL变更传输到其他系统。Canal为变更日志提供了统一的数据格式,并支持使用JSON或protobuf序列化消息(Canal默认使用…...
玩转贝启科技BQ3588C开源鸿蒙系统开发板 —— DevEco Studio下载与安装
一、下载DevEco Studio IDE开发工具 1. 登录鸿蒙官网 网址为: 华为HarmonyOS智能终端操作系统官网 | 应用设备分布式开发者生态 页面如下: 2. 搜索“DevEco Studio IDE” 点击右上角的“请输入关键词”,在其中搜索“DevEc…...
大模型上下文长度的超强扩展:从LongLora到LongQLora
前言 本文一开始是《七月论文审稿GPT第2版:从Meta Nougat、GPT4审稿到Mistral、LongLora Llama》中4.3节的内容,但考虑到 一方面,LongLora的实用性较高二方面,为了把LongLora和LongQLora更好的写清楚,而不至于受篇幅…...
pdf格式转换为txt格式
pdf文档转换为txt文档 首先在python3虚拟环境中安装PyPDF2 Python 3.6.8 (default, Jun 20 2023, 11:53:23) [GCC 4.8.5 20150623 (Red Hat 4.8.5-44)] on linux Type "help", "copyright", "credits" or "license" for more infor…...
scss使用for循环遍历,动态赋值类名并配置不同颜色
需求:后端要传入不同的等级,前端通过等级展示不同的字体颜色,通过scss遍历更有利于动态修改颜色或者增删等级 1.通过 for $i from 1 through 4 定义循环,索引值为i 2.nth($colors, $i) 取出对应的颜色 $colors: #ff0000, #00ff…...
Admin.Net中的消息通信SignalR解释
定义集线器接口 IOnlineUserHub public interface IOnlineUserHub {/// 在线用户列表Task OnlineUserList(OnlineUserList context);/// 强制下线Task ForceOffline(object context);/// 发布站内消息Task PublicNotice(SysNotice context);/// 接收消息Task ReceiveMessage(…...
MongoDB学习和应用(高效的非关系型数据库)
一丶 MongoDB简介 对于社交类软件的功能,我们需要对它的功能特点进行分析: 数据量会随着用户数增大而增大读多写少价值较低非好友看不到其动态信息地理位置的查询… 针对以上特点进行分析各大存储工具: mysql:关系型数据库&am…...
EtherNet/IP转DeviceNet协议网关详解
一,设备主要功能 疆鸿智能JH-DVN-EIP本产品是自主研发的一款EtherNet/IP从站功能的通讯网关。该产品主要功能是连接DeviceNet总线和EtherNet/IP网络,本网关连接到EtherNet/IP总线中做为从站使用,连接到DeviceNet总线中做为从站使用。 在自动…...
图表类系列各种样式PPT模版分享
图标图表系列PPT模版,柱状图PPT模版,线状图PPT模版,折线图PPT模版,饼状图PPT模版,雷达图PPT模版,树状图PPT模版 图表类系列各种样式PPT模版分享:图表系列PPT模板https://pan.quark.cn/s/20d40aa…...
算法岗面试经验分享-大模型篇
文章目录 A 基础语言模型A.1 TransformerA.2 Bert B 大语言模型结构B.1 GPTB.2 LLamaB.3 ChatGLMB.4 Qwen C 大语言模型微调C.1 Fine-tuningC.2 Adapter-tuningC.3 Prefix-tuningC.4 P-tuningC.5 LoRA A 基础语言模型 A.1 Transformer (1)资源 论文&a…...
JVM 内存结构 详解
内存结构 运行时数据区: Java虚拟机在运行Java程序过程中管理的内存区域。 程序计数器: 线程私有,程序控制流的指示器,分支、循环、跳转、异常处理、线程恢复等基础功能都依赖这个计数器完成。 每个线程都有一个程序计数…...
PAN/FPN
import torch import torch.nn as nn import torch.nn.functional as F import mathclass LowResQueryHighResKVAttention(nn.Module):"""方案 1: 低分辨率特征 (Query) 查询高分辨率特征 (Key, Value).输出分辨率与低分辨率输入相同。"""def __…...
scikit-learn机器学习
# 同时添加如下代码, 这样每次环境(kernel)启动的时候只要运行下方代码即可: # Also add the following code, # so that every time the environment (kernel) starts, # just run the following code: import sys sys.path.append(/home/aistudio/external-libraries)机…...
Web后端基础(基础知识)
BS架构:Browser/Server,浏览器/服务器架构模式。客户端只需要浏览器,应用程序的逻辑和数据都存储在服务端。 优点:维护方便缺点:体验一般 CS架构:Client/Server,客户端/服务器架构模式。需要单独…...
【p2p、分布式,区块链笔记 MESH】Bluetooth蓝牙通信 BLE Mesh协议的拓扑结构 定向转发机制
目录 节点的功能承载层(GATT/Adv)局限性: 拓扑关系定向转发机制定向转发意义 CG 节点的功能 节点的功能由节点支持的特性和功能决定。所有节点都能够发送和接收网格消息。节点还可以选择支持一个或多个附加功能,如 Configuration …...
