vue3,ref和reactive声明变量有什么区别,分别怎么用

vue/vue3,ref和reactive声明变量有什么区别,分别怎么用

适用的变量类型不同

  1. 对于原始类型,即非对象类型,只能用ref
  2. 对于对象类型,既可以用ref,也可以用reactive

在js中获取值的方式不同

  1. 在js中,获取ref声明的变量值,需要通过 .value 获取
  2. 获取react声明的变量值,直接获取即可

侦听深度不同

  1. 如果侦听ref声明的对象类型变量,当变量的属性发生变化时,不触发侦听,需要设置深度侦听{deep:true}
  2. 如果侦听reactive声明的变量,当变量的属性发生变化时,触发侦听,无需设置深度侦听

响应性区别

  1. ref声明的对象类型变量,可以通过 .value直接用新的对象赋值,改变变量的值,变量响应性存在
  2. 给reactive包裹的对象类型变量重新赋值,变量响应性消失,该方法不可取。
  3. reactive包裹的对象可以通过Vue.set()方法来重新赋值
  4. reactive包裹的对象给其属性赋值,是不会影响响应性的

相关推荐

  1. Vue3refreactive区别什么

    2024-03-21 08:10:07       54 阅读
  2. vue3 ref reactive 区别

    2024-03-21 08:10:07       35 阅读
  3. Vue3refreactive区别

    2024-03-21 08:10:07       61 阅读
  4. Vue3 ReactiveRef

    2024-03-21 08:10:07       35 阅读
  5. vue refreactive区别

    2024-03-21 08:10:07       51 阅读
  6. var、let const声明变量什么区别

    2024-03-21 08:10:07       68 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-03-21 08:10:07       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-03-21 08:10:07       100 阅读
  3. 在Django里面运行非项目文件

    2024-03-21 08:10:07       82 阅读
  4. Python语言-面向对象

    2024-03-21 08:10:07       91 阅读

热门阅读

  1. 力扣每日练习(3.19)补

    2024-03-21 08:10:07       43 阅读
  2. 插件电感的工艺结构原理及选型参数总结

    2024-03-21 08:10:07       39 阅读
  3. React.js入门级教程附带代码详解

    2024-03-21 08:10:07       34 阅读
  4. Spark面试整理-Spark的主要组件是什么?

    2024-03-21 08:10:07       40 阅读
  5. 2024最新华为OD机试试题库全 -【转盘寿司】- C卷

    2024-03-21 08:10:07       32 阅读
  6. 安卓面试题多线程 66-70

    2024-03-21 08:10:07       34 阅读
  7. 【开发方案】Android 应用双卡搜网功能

    2024-03-21 08:10:07       45 阅读
  8. 【Python基础】collections.Counter()

    2024-03-21 08:10:07       46 阅读
  9. 请求为blob,但是返回json格式,如何处理

    2024-03-21 08:10:07       37 阅读