reactive

Vue3组合API初体验

Vue3组合API初体验基本概念与作用说明示例一：使用ref创建响应式数据示例二：使用reactive创建响应式对象示例三：使用computed计算属性示例四：使用watch监听数据变化示例五：使用provide

DTcode7·2025-07-29 12:31

Vue 3 响应式系统源码解析：ref 与 reactive 的实现原理

核心功能概述Vue3的响应式系统主要基于ref和reactive两个API：ref：可以定义基本类型或对象类型，通过.value访问reactive：只能定义对象类型，直接访问属性reactive实现原理核心创建流程

PIGLANG·2025-07-24 11:03

基于注入的一种状态管理的思路

上文说了，我们可以定义一个reactive结构的userOnline，然后注入到根组件里面，那么相关的处理函数要怎么办呢？

自然框架·2025-07-24 01:49

React 最新版本（hooks写法）

、指令jsx语法：需要注意的是：react的类名class变成了className，事件从onClick，因为class是react的内部关键字动态数据useState()相当于Vue3的ref（），reactive

抬头第一眼，是天·2025-07-23 04:39

【vue-7】Vue3 响应式数据声明：深入理解 reactive()

reactive()是Vue3组合式API中最核心的响应式函数之一。本文将深入探讨reactive()的工作原理、使用场景以及最佳实践。1.什么是reactive()?

AllenBright·2025-07-20 22:51

Spring for Apache Pulsar-＞Reactive Support-＞Quick Tour

我们将通过展示一个以响应式方式生成和消费的示例SpringBoot应用程序，快速了解Spring对ApachePulsar的响应式支持。这是一个完整的应用程序，不需要任何额外的配置，只要您在默认位置localhost:6650上运行Pulsar集群即可。1.DependenciesSpringBoot应用程序只需要SpringBoot启动器脉冲响应依赖关系。以下清单分别显示了如何定义Maven和G

·2025-07-11 16:37

Vue3面试必刷36题（2024最新版）

4.ref和reactive有什么区别？（高频题）三、进阶实战篇5.组件通信方式大全（超级重要）6.如何实现权限按钮控制？四、性能优化篇7.项目打包体积太大怎么破？8.长列表渲染卡

systemseer·2025-07-10 07:29

py_trees实践:实现机器人循迹任务

这个逻辑体现了行为树响应性(Reactive)的特点，希望对学习行为树的同学有一点参考价值。下面直接给出相应的代码：#!/usr/bin/python3#coding:utf-8

H1_Coldfire·2025-07-09 14:41

Vue3 响应式原理揭秘：为什么数据一改页面就变？

一切的秘密，就藏在Vue的reactive()函数背后！

qqqdqd·2025-07-09 00:35

vue数组变化侦测

(Vue3的Proxy)在Vue3中，当你用ref([])或reactive([])创建一个响应式数组时，你得到的其实不是一个普

翻滚吧键盘·2025-07-07 22:59

vue3项目的筛选是树状 el-tree 二级树结构（个人笔记）

先说一下筛选要求：可以多选，可以全选，可以取消全选（清空），可以关键字筛选（以下案例仅限于二级的树结构，多级的没有试）,截图如下：废话不多说，上代码全选清空letform=reactive({certificationCategory

齐露·2025-07-07 09:27

Vue - 深入理解 Vue 3 中的 ref 和 reactive

本文将重点介绍Vue3中的两个核心响应式API—ref和reactive，并理解它们的区别、使用场景以及如何在实际项目中有效利用它们。

·2025-07-07 07:42

Vue3 中ref和reactive的区别

文章目录一、ref和reactive定义二、ref和reactive区别三、到底项目中使用ref还是reactive？

小码龙~·2025-07-07 06:12

＜script setup＞中的setup作用以及和不带的区别对比

以下是具体分析：一、setup的作用初始化响应式状态在setup中，可以通过ref和reactive创建响应式数据，替代OptionsAPI中的data选项[1][3]。

·2025-07-06 09:57

vue中添加原生右键菜单

数据结构定义conststate=reactive({contextMenu:{visible:false,x:0,y:0,currentItem:null}});//新增右键菜单处理函数consthandleContextMenu

叹一曲当时只道是寻常·2025-07-06 07:37

quasar框架切换Tab页使用＜keep-alive＞缓存

写法1:使用quasar的q-tabs组件使用方法//布局样式根据需求自己设置import{ref,shallowRef,watch,nextTick,onMounted,inject,reactive

·2025-07-05 10:48

spring中maven缺少包如何重新加载，报错java: 程序包org.springframework.web.reactive.function不存在

错误原因分析java:程序包org.springframework.web.reactive.function不存在这个错误是由于项目中缺少SpringWebFlux相关依赖导致的。

东方-教育技术博主·2025-07-03 01:14

GlobalFilter、Filter关系

维度GlobalFilterFilter技术体系SpringCloudGateway+WebFluxJavaServletAPI编程模型响应式(Reactive)阻塞式(Imperative)作用范围全局

m0_63486540·2025-07-02 23:26

vue中的toRef

其参数格式及用法如下：toRef的参数说明1.参数1：源对象（必须）-类型：Object（通常是通过reactive创建的响应式对象）。-作用：指定需要提取属性的原始对象。

咔咔咔索菲斯·2025-07-02 21:14

Vue 响应式数据传递：ref、reactive 与 Provide/Inject 完全指南

Vue响应式数据传递：ref、reactive与Provide/Inject完全指南理解如何在不同组件层级间传递响应式数据是Vue开发的关键技能。

·2025-07-02 19:55

Vue3 中watch和computed

以下是详细说明一、watch侦听器1.基础类型监听实际参数1={{count}}点击import{reactive,ref,watch}from"vue";constcount=ref(0)conststate

行云＆流水·2025-07-02 10:46

ref() 与 reactive()

下面，我们来系统的梳理关于ref()与reactive()的基本知识点：一、响应式编程核心概念1.1什么是响应式编程？响应式编程是一种声明式编程范式，它使数据变化能够自动传播到依赖它的代码部分。

前端岳大宝·2025-06-28 17:34

vue3 实现文件上传

1、上传文件html上传文件将文件拖到此处，或点击上传只支持pdf、doc、docx、png、jpg提交import{ref,reactive}from'vue'import{uploadImg

编程（变成）小辣鸡·2025-06-28 10:16

vue3教程笔记

组合式写法：reactive()只适用于对象（数组或者内置对象），创建的对象都是js的proxy。

Xaire·2025-06-27 20:19

vue3递归组件的使用

HelloWorld.vue{{item}}import{ref,reactive}from'vue'importHelloWorldTtemfrom'.

未央区邓紫棋·2025-06-27 04:27

3DSwiper 好看的走马灯轮播图

代码来源vue3写法，复制即用❮❯//配置参数constconfig=reactive({maxWidth:'180px',speed:10000,//轮播速度multiple

·2025-06-26 17:09

Vue3父子组件通信

一，父传子：props单向数据流原则禁止子组件直接修改prop通过自定义事件通知父组件更新App.vue我是父组件更新父组件数据,传递到子组件了import{ref,reactive}from'vue'importCompfrom

一只路人甲·2025-06-26 16:32

使用vue3+el-form实现动态新增名称，值，并对名称进行必填校验

使用vue3+el-form实现动态新增名称，值，并对名称进行必填校验效果图代码+-AddItem-->Submit-->import{ref,reactive,defineProps,watch}from'vue'constprops

从不讲道理·2025-06-24 03:56

Vue3 响应式原理

目录一、Proxy代理1.Proxy工作原理2.依赖收集系统3.ref的实现原理4.reactive的实现原理5.副作用系统（Effect）6.响应式系统的优势7.响应式流程总结二、组件触发渲染的时机1

旺代·2025-06-23 15:35

Spring Boot - 实用功能24 - webflux

SpringBoot-实用功能24-webflux文章目录SpringBoot-实用功能24-webflux一：webflux介绍1：什么是webflux2：异步非阻塞3：响应式编程4：Reactive

是小崔啊·2025-06-18 07:41

el-select如何同时获取value和label？

定义变量：constgroupForm=ref({})constgroupList=reactive([ {"

Angel_girl319·2025-06-17 18:49

vue3使用scale属性来实现大屏自适应铺满整个屏幕

importdebouncefrom"lodash/debounce";import{computed,reactive}from"vue";letthat=reactive({width:1920,height

月伤59·2025-06-17 18:47

Vue2到Vue3进阶：第二篇 - 响应式系统深度解析

本篇将深入探讨Vue3的响应式系统，从原理到实战全面解析ref、reactive等核心API，帮助你彻底掌握Vue3的响应式机制一、Vue2响应式系统回顾与局限1.1Vue2的Object.defineProperty

踢足球的，程序猿·2025-06-17 16:59

uniapp+vue3 随机、换一批

uni-app'importifrom'@/libs/common/index.js'importapifrom'@/request/api.js'import{nextTick,ref,shallowRef,reactive

耶啵奶膘·2025-06-16 16:20

模块自动导入的小工具

import{ref,reactive,onMounted}from'vue'import{useRoute,useRouter}from'vue-router'项目里很多文件都需要引入这些公共库，比较繁琐

qq_46435701·2025-06-15 17:55

vue3 element plus 表格单选，默认选中行、选中、清空

选中第三行清空import{reactive,ref,nextTick}from'vue'constsingleTableRef=ref(null)consttableData=reactive([{date

.see you.·2025-06-15 11:38

【vue3.0学习】 reactive函数 toRef函数

reactive是一个函数，它可以定义一个复杂数据类型，成为响应式数据。

别亦难�·2025-06-13 17:52

vue3基础ref,reactive,toRef ,toRefs 使用和理解

在Vue3中，ref、reactive、toRef和toRefs是用于响应式数据管理的重要工具。理解它们的使用方式和区别对于有效地利用Vue3的响应式系统至关重要。以下是对这些工具的详细解释和示例。

F2601775592·2025-06-13 16:20

Element Plus 组件库 - Form 表单针对数值类型的表单校验观察

Form表单针对数值类型的表单校验观察测试代码constmyConfigParams=reactive({ip:"",port:null,});constmyConfigRules=reactive({

我命由我12345·2025-06-13 14:31

vue3笔记（1）自用

目录一、ref和reactive的区别1.ref2.reactive3、核心区别4、原理差异1.ref的实现2.reactive的实现5、常见误区二、计算属性（Computed）1.基本用法2.计算属性的

zhaoyang0301·2025-06-12 13:32

el-table封装自动滚动表格（适用大屏）

import{ref,onUnmounted,reactive,onMounted,nextTick}from'vue';consttableData=ref([{date:'2016-05-03',name

小猫猫改bug·2025-06-11 20:06

Vue3.0

文章目录Vue3的简介一、创建一个Vue项目1.使用vue-cli创建2.使用vite创建二、Vue3的目录文件三、CompositionAPI1.setup2.ref函数3.reactive函数4.Vue3

时常.·2025-06-09 19:26

echarts tooltip 无法正常显示

在vue3中，无法正常显示tooltip，根据echarts官网配置项正确配置：constoption=reactive({title:{text:'用户操作平均时长',},//正确配置tooltip:

·2025-06-09 14:50

在uni-app中如何从Options API迁移到Composition API？

迁移到CompositionAPI的详细指南一、迁移前的准备升级环境：确保HBuilderX版本≥3.2.0项目uni-app版本≥3.0.0了解CompositionAPI基础：响应式系统：ref、reactive

疯狂的沙粒·2025-06-08 21:16

微信小程序前端面经

一、技术栈与编码能力（10min）1.Vue3&CompositionAPIQ1：请解释一下ref和reactive的区别？你在项目中是如何使用的？

Nueuis·2025-06-06 04:20

Vue3 - 响应式工具函数（使用教程）

前言您需要对ref()、reactive()有所了解，否则要先学习这些。Vue3为响应式提供了一些工具函数，辅助开发：API说明isRef()检查某个值是否为ref。

王二红·2025-06-05 06:18

Spring Boot 中的 Web 应用与 Reactive Web 应用

该判断题表述为：“SpringBoot启动过程中会判断当前应用类型是Web应用还是ReactiveWeb应用。”这个说法是正确的。SpringBoot的自动配置机制会检查类路径，以确定是将应用程序配置为传统的ServletWeb应用还是ReactiveWeb应用。SpringBoot中的Web应用与ReactiveWeb应用⚡SpringBoot支持两种截然不同的编程模型来构建Web应用程序：We

翻滚吧键盘·2025-06-03 20:01

Vue 3 响应式系统中，reactive 和 shallowReactive 的区别是什么？如何手动触发响应式更新？

大白话Vue3响应式系统中，reactive和shallowReactive的区别是什么？如何手动触发响应式更新？前端小伙伴们，有没有遇到过这种情况？

前端布洛芬·2025-06-02 23:28

Vue-4-前端框架Vue基础入门之Vue的常用操作

文章目录1VUE1.1文件结构1.2定义和显示变量1.2.1ref函数1.2.2reactive函数1.3定义方法1.3.1方式一1.3.2方式二1.3.3方式三1.4循环遍历1.5watch1.5.1

皮皮冰燃·2025-06-02 17:15

【重学 Vue：深入本质，脱离八股文，彻底搞定面试】：（六）响应式的本质

重学Vue：深入本质，脱离八股文，彻底搞定面试】：（四）数据拦截的本质和《【重学Vue：深入本质，脱离八股文，彻底搞定面试】：（五）响应式数据的本质》中，我们深入理解了JS中的两种数据拦截方式、ref和reactive

Catunderumbrella·2025-06-01 23:37

推荐频道