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

ref和reactive, toRefs的使用

看尤雨溪说:为什么Vue3 中应该使用 Ref 而不是 Reactive?

toRefs

import { ref, toRefs } from 'vue';// 定义一个响应式对象
const state = ref({count: 0,name: 'Vue'
});// 使用toRefs转换为响应式引用对象
const reactiveState = toRefs(state);// 现在你可以对reactiveState进行解构赋值并保持响应性
const { count, name } = reactiveState;// 当你改变count或name的值时,state的值也会相应改变
count.value++; // 相当于state.count++
name.value = 'Vue3'; // 相当于state.name = 'Vue3'

相关文章:

  • 【RL】Basic Concepts in Reinforcement Learning
  • Day01-变量和数据类型课后练习-参考答案
  • 《C程序设计》上机实验报告(六)之函数及其应用
  • BC107 矩阵转置
  • 踩坑实录(First Day)
  • SpringBoot之整合PageHelper分页插件
  • 代码随想录算法训练营DAY14 | 二叉树 (1)
  • vue3 之 组合式API—computed
  • 代码随想录算法训练营第四十一天| 343. 整数拆分、96.不同的二叉搜索树
  • 忘记 RAG:拥抱Agent设计,让 ChatGPT 更智能更贴近实际
  • 【多模态大模型】视觉大模型SAM:如何使模型能够处理任意图像的分割任务?
  • LeAPI 后端接口开发 - 发布、下线接口
  • 导出pdf 加密、加水印、加页脚
  • 计组学习笔记2024/2/5
  • 框架学习Maven
  • 5、React组件事件详解
  • Apache的基本使用
  • GraphQL学习过程应该是这样的
  • httpie使用详解
  • Java面向对象及其三大特征
  • jquery cookie
  • JS题目及答案整理
  • SpringCloud(第 039 篇)链接Mysql数据库,通过JpaRepository编写数据库访问
  • 关于使用markdown的方法(引自CSDN教程)
  • 记一次用 NodeJs 实现模拟登录的思路
  • 开源地图数据可视化库——mapnik
  • 看域名解析域名安全对SEO的影响
  • 可能是历史上最全的CC0版权可以免费商用的图片网站
  • 面试题:给你个id,去拿到name,多叉树遍历
  • 使用前端开发工具包WijmoJS - 创建自定义DropDownTree控件(包含源代码)
  • 算法之不定期更新(一)(2018-04-12)
  • 学习Vue.js的五个小例子
  • ​HTTP与HTTPS:网络通信的安全卫士
  • #每日一题合集#牛客JZ23-JZ33
  • (09)Hive——CTE 公共表达式
  • (Bean工厂的后处理器入门)学习Spring的第七天
  • (八)Docker网络跨主机通讯vxlan和vlan
  • (笔试题)合法字符串
  • (附源码)spring boot建达集团公司平台 毕业设计 141538
  • (附源码)ssm考试题库管理系统 毕业设计 069043
  • (四)图像的%2线性拉伸
  • (转)程序员技术练级攻略
  • ./configure,make,make install的作用
  • .class文件转换.java_从一个class文件深入理解Java字节码结构
  • .Net CF下精确的计时器
  • .Net FrameWork总结
  • .Net的C#语言取月份数值对应的MonthName值
  • .NET上SQLite的连接
  • .net通用权限框架B/S (三)--MODEL层(2)
  • @31省区市高考时间表来了,祝考试成功
  • @ComponentScan比较
  • []新浪博客如何插入代码(其他博客应该也可以)
  • [AIGC] SQL中的数据添加和操作:数据类型介绍
  • [C/C++]数据结构 堆的详解
  • [Contiki系列论文之2]WSN的自适应通信架构