10_Vue3 其它的组合式API（Composition API）

最新推荐文章于 2025-12-17 21:27:18 发布
原创 最新推荐文章于 2025-12-17 21:27:18 发布 · 251 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前端 #vue #前端框架 #vue.js #笔记

本文详细解析了Vue3中的组合式API，包括shallowReactive、shallowRef、readonly与shallowReadonly、toRaw与markRaw以及customRef。同时涵盖了provide和inject的使用，以及如何判断响应式数据。

Vue3 中的其它组合式API

1.shallowReactive 与 shallowRef

 2. readonly 与 shallowReadonly

 3.toRaw 与 markRaw

 4.customRef

 

5.provide 与 inject

 

6.响应式数据的判断 

 

 

「Vue3系列」Vue3 组合式 API
日常笔记/总结/系列知识梳理
03-09 1812
通过模板引用，你可以在组件的 JavaScript 代码中引用模板中的特定元素或组件，从而能够直接操作它们或访问它们的属性和方法。组合式 API 的核心思想是将组件的逻辑分割成更小的函数（或称为“组合函数”），这些函数可以根据需要被引入和重用。函数是组合式 API 的核心，它提供了一个新的逻辑组织方式，允许你使用响应式状态、计算属性、方法、生命周期钩子等，而不必依赖于 Vue 组件的选项对象。函数返回一个对象，该对象中的属性将在模板中作为组件的响应式状态、方法或计算属性来使用。
vue3之选项式 API (Options API)与组合式 API (Composition API)
点点滴滴
10-13 947
然而，只推荐你在一个已经基于选项式 API 开发了很久、但又需要和基于组合式 API 的新代码或是第三方库整合的项目中这样做。attribute 是一个标识，告诉 Vue 需要在编译时进行一些处理，让我们可以更简洁地使用组合式 API。组合式 API 是 Vue 3 中引入的新方式，通过导入 Vue 的 API 函数（如。都是选项式 API 的一部分，它们定义了组件的状态、计算属性、方法和生命周期钩子。选项式 API 是 Vue 2 中的传统方式，通过在组件对象中定义多个选项（如。等）来描述组件的逻辑。
vue3 组合式API composition 简单使用
jyn15159的博客
03-12 2386
composition api 组合式API 官网文档 通过创建 Vue 组件，可以将界面中重复的部分连同其功能一起提取为可重用的代码段。 使用 (data、computed、methods、watch) 组件选项来组织逻辑通常都很有效。然而，当组件开始变得更大时，逻辑关注点的列表也会增长。尤其对于那些一开始没有编写这些组件的人来说，这会导致组件难以阅读和理解。 这种碎片化使得理解和维护复杂组件变得困难。选项的分离掩盖了潜在的逻辑问题。此外，在处理单个逻辑关注点时，必须不断地“跳转”相关代码的选项块。 如
Vue3之组合式API详解
一个老Java开发的自白
12-15 1718
Vue 3引入了组合式API，旨在提升组件逻辑复用性和可维护性。它允许通过setup函数以函数式方式组织组件逻辑，特点包括响应式状态、生命周期钩子和依赖注入。组合式API适用于新项目、大型项目、需复用逻辑的场景以及TypeScript用户。其优势在于更好的逻辑复用、更清晰的逻辑组织、更优的TypeScript支持和性能优化。核心API如ref、reactive用于定义响应式数据，computed定义计算属性，watch监听数据变化，还有生命周期钩子如onMounted等。
Vue3 Composition API即组合式API完全指南
莫循的AI编程博客
04-02 2420
组合式API（Composition API）是Vue3的核心特性，它通过逻辑功能聚合和高复用性解决了复杂组件的代码组织问题。功能聚合：将同一功能的响应式数据、计算属性、方法等集中管理逻辑复用：通过自定义Hook实现跨组件逻辑复用类型支持：完美支持TypeScript类型推断渐进式：可与选项式API混合使用return {count,double,increment,reset// 组件使用</script>
vue3 组合式API语法 (Composition API)
微雨醉桃花的博客
09-11 1135
vue3组合式语法要点
【Vue】组合式API（Composition API）
Guiat的博客
04-24 1904
组合式API(Composition API)是Vue 3引入的一种新的编写组件逻辑的方式，它是对Vue 2中选项式API(Options API)的补充和扩展。组合式API允许开发者按照逻辑关注点组织代码，提高代码的可读性和可维护性。// 为ref指定类型number(0)// 为reactive指定类型import {
掌握Vue 3 Composition API与可复用组合式函数
weixin_36178216的博客
05-10 376
本篇博客详细介绍了Vue 3 Composition API中的computed()函数的使用方法，如何创建和应用可复用的组合式函数（composables），以及如何通过Axios处理外部数据。文章通过实例代码和图示，展示了如何使用computed()优化组件响应性逻辑，创建自定义组合式函数以提高代码复用性，并利用Axios库简化与外部资源的数据交互。
vue3组合式API
ngczx的博客
09-06 2625
组合式 API通过setup函数，提供了更加灵活的方式来组织和复用组件逻辑。它增强了代码的可复用性和可维护性，特别是在复杂的应用场景下，能更好地组织代码。响应式系统更加灵活，ref和reactive简化了状态管理。组合式函数（Composable）提供了更简洁的逻辑复用模式，替代了传统的mixin。
18_Vue3_Composition_API的基础使用(一)
酒客的博客
02-13 627
Vue3Composition-API的基础使用(一) 认识Mixin 目前我们是使用组件化的方式在开发整个Vue的应用程序，但是组件和组件之间有时候会存在相同的代码逻辑，我们希望对相同的代码逻辑进行抽取。 在Vue2和Vue3中都支持的一种方式就是使用Mixin来完成： Mixin提供了一种非常灵活的方式，来分发Vue组件中的可复用功能； 一个Mixin对象可以包含任何组件选项； 当组件使用Mixin对象时，所有Mixin对象的选项将被 混合 进入该组件本身的选项中； Mixin的基本使用 Mixi
11_Vue3-Composition-API（二）.pptx
01-25
Vue 3 Composition API 组合式 API 详解 Vue 3 Composition API 是 Vue 3 中的一种新的编程模型，它提供了一种更加灵活和强大的一种方式来构建 Vue 应用程序。Composition API 是对 Options API 的一种补充和改进...
基于Vue3和TypeScript构建的企业级前端项目脚手架_包含Vue3组合式API_TypeScript类型检查_ESLint代码规范_Vite快速构建_ElementPlus.zip
08-12
随着Vue3的发布，框架引入了组合式API（Composition API），使得组件逻辑复用和组织更加清晰高效。与此同时，TypeScript作为JavaScript的超集，提供了静态类型检查的能力，帮助开发者减少运行时的错误，提高代码质量...
浅谈Vue3 Composition API如何替换Vue Mixins
10-15
2. **自定义指令和组合式函数**：Vue3 允许我们创建自定义指令（如 `v-my-directive`），并且通过组合式函数（也称为组合函数或组合API）将复杂的逻辑封装起来，这些函数可以返回需要在 `setup()` 中使用的对象，...
商城后台管理系统 02 添加规格参数-动态表单
weixin_52943021的博客
12-15 257
Boolean。
商城后台管理系统 03 规格参数配置
weixin_52943021的博客
12-15 203
【代码】商城后台管理系统 03 规格参数配置。
Harmony OS Web 组件：如何在新窗口中打开网页（实战分享）
Yihong1833100198的博客
12-17 687
摘要：本文分享了Harmony OS Web组件实现新窗口打开网页的实战经验。通过multiWindowAccess()设置允许新窗口，结合onWindowNew回调捕获并处理网页中的新窗口请求（如target="_blank"链接或window.open调用）。文章提供了典型应用场景（如区分内外链处理）、完整代码示例和常见问题解决方案，帮助开发者实现更智能的网页打开策略，提升应用体验。
12.17 脚本网页 创意导航
2503_93413701的博客
12-17 326
分享一下短小，好看的导航。
【短链接项目笔记】Day1 用户模块
最新发布
m0_54394021的博客
12-17 737
短链接（Short Link）是指将一个原始的长 URL（Uniform Resource Locator）通过特定的算法或服务转化为一个更短、易于记忆的 URL。短链接通常只包含几个字符，而原始的长 URL 可能会非常长。短链接的原理非常简单，通过一个原始链接生成个相对短的链接，然后通过访问短链接跳转到原始链接。
大模型通义千问3-VL-Plus - QVQ 视觉推理模型
weixin_66243333的博客
12-14 827
本文介绍了视觉推理模型及其实现方法。该模型适用于需要逻辑分析的视觉任务（如数学题解答、图表分析等），特点是先输出思考过程再给出最终答案。文章详细展示了基于QVQ模型的后端实现，包括请求实体、服务接口、实现类和控制器代码，支持流式返回推理过程。测试结果表明该方案能有效拆分思考过程和最终回复，适用于复杂视觉分析场景，相比普通视觉模型更具可解释性。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值