首页 > 其他分享 >vue3知识点:reactive对比ref

vue3知识点:reactive对比ref

时间:2024-10-31 15:59:39浏览次数:3  
标签:知识点 函数 reactive vue3 ref 对比

在这里插入图片描述
@

目录

二、常用 Composition API

问题:啥叫“组合式API”?

答案:请看官方文档: https://v3.cn.vuejs.org/guide/composition-api-introduction.html

5.reactive对比ref

  • 从定义数据角度对比:
    • ref用来定义:基本类型数据
    • reactive用来定义:对象(或数组)类型数据
    • 备注:ref也可以用来定义对象(或数组)类型数据, 它内部会自动通过reactive转为代理对象
  • 从原理角度对比:
    • ref通过Object.defineProperty()getset来实现响应式(数据劫持)。
    • reactive通过使用Proxy来实现响应式(数据劫持), 并通过Reflect操作源对象内部的数据。
  • 从使用角度对比:
    • ref定义的数据:操作数据需要.value,读取数据时模板中直接读取不需要.value
    • reactive定义的数据:操作数据与读取数据:均不需要.value

本人其他相关文章链接

1.《vue3第二章》常用组合式 Composition API,包括setup、ref函数、reactive函数、vue3.0中的响应式原理、计算属性与监听属性
2.vue3知识点:setup
3.vue3知识点:ref函数
4.vue3知识点:reactive函数
5.vue3知识点:Vue3.0中的响应式原理和 vue2.x的响应式
6.vue3知识点:reactive对比ref
7.vue3知识点:计算属性与监视属性
8.vue3知识点:生命周期
9.vue3知识点:自定义hook函数
10.vue3知识点:toRef函数和toRefs函数

标签:知识点,函数,reactive,vue3,ref,对比
From: https://www.cnblogs.com/bigcat26/p/18518100

相关文章

  • 从零到精通大模型!超详细入门知识点汇总,一篇在手,学习无忧!
    采用提问方式,从个人知识盲点开始,渐进式掌握大模型入门知识点。‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍1、大模型中7b、70B代表什么在讨论人工智能领域特别是大型语言模型(LLMs)时,“7b”和“70B”均用来表示模型所包含的参数数量。这里的“b”是英文“Billion”......
  • vue3知识点:响应式数据的判断
    @目录三、其它CompositionAPI(不常用,了解即可)6.响应式数据的判断测试案例完整代码本人其他相关文章链接三、其它CompositionAPI(不常用,了解即可)6.响应式数据的判断测试案例完整代码项目目录main.js//引入的不再是Vue构造函数了,引入的是一个名为createApp的工......
  • 软件测试知识点汇总
    第一部分:(软件)测试概念类1、软件质量软件质量是“软件满足规定或潜在用户需求特性的总和”。反映出如下3方面的问题:1)软件需求是度量软件质量的基础。不符合需求的软件就不具备质量。2)软件人员必须遵循软件过程规范,用工程化的方法来开发软件。3)满足一些没有明确规定的隐含......
  • vue3-ref 和 reactive
    文章目录vue3中ref和reactivereactive与ref不同之处ref处理复杂类型vue3中ref和reactiveref原理基本原理ref是Vue3中用于创建响应式数据的一个函数。它的基本原理是通过Object.defineProperty()(在JavaScript的规范中用于定义对象属性的方法)或者Proxy......
  • vue3知识点:Teleport组件
    @目录五、新的组件2.Teleport案例完整代码本人其他相关文章链接五、新的组件2.Teleport问题:什么是Teleport? 答案:Teleport是一种能够将我们的组件html结构移动到指定位置的技术。<teleportto="移动位置"> <divv-if="isShow"class="mask"> <divclass="dialog"> &l......
  • HTTP知识点
    常见题目:1.HTTP常见的状态码1xx服务器收到请求,但还没返回数据。(不常用)2xx请求成功,如2003xx重定向,如3024xx客户端错误,如4045xx服务端错误,如500-常见状态码:200成功301永久重定向(配合location,浏览器自动处理),location是新的地址,浏览器会记住这个地址,浏览器永远......
  • ElasticSearch知识点小记
    ElasticSearch索引的基本操作#创建索引PUT/index_name可以初始不定义{ "settings":{ //索引设置 "number_of_shards":"1",//索引的分片书决定了索引的并行度和数据分布不可以动态修改 "number_of_replicas":"1",//副本的数量提高了数据的可用性和容错能力可以动态......
  • 解决:swagger2 Could not resolve reference because of: Could not resolve pointer:
    问题:使用swagger时页面出现报警信息mavaen依赖版本:2.8.0<!--swagger2--><dependency><groupId>io.springfox</groupId><artifactId>springfox-swagger2</artifactId><version>2.8.0<......
  • Groovy语言知识点简要介绍
    语法规则##注释**单行**注释使用//在该行的任==何位==置来识别。**多行**注释标识与在开始/*和*/识别多行注释的末尾。##分号像Java编程语言,它需要具有**分号**在Groovy定义多个语句之间进行区分。##关键字###除java之外的特殊数字类型定义,如:BigInteg......
  • C#01-C#知识点
    @目录0.什么是C#?1.什么是类?2.面向对象编程的主要概念是什么?3.什么是对象?4.什么是构造函数,它有哪些不同的类型?5.C#中的析构函数是什么?6.C#代码是托管代码还是非托管代码?7.什么是值类型和引用类型?8.什么是命名空间,它是强制性的吗?9.用例子解释C#中的注释类型10.请解释封装11.什......