shallowRef和shallowReactive

一，前言

1.相对于ref和reactive，shallowRef 和shallowReactive创建的数据是浅响应式的

二，`shallowRef`介绍

1.shallowRef可以创建一个跟踪自身 .value 变化的 ref，但不会使其值也变成响应式的

2.当使用shallowRef为一个基础类型数据创建响应性时，行为是和ref一样的。

3.不同的是，当使用shallowRef为复杂类型创建响应性时，修改深层属性，不具备响应性

const a = shallowRef({b:1})
a.value.b = 2  //视图不会更新
console.log(a.value) //{b : 2} 但是能追踪到值得变化a.value={b:2} //一整个替换时，视图会变化

三，`shallowReactive`介绍

1.创建一个响应式代理，它跟踪其自身 property 的响应性，但不执行嵌套对象的深层响应式转换 (暴露原始值)

2.相对于reactive，shallowReactive只有最外层的属性是响应的

const state = shallowReactive({foo: 1,nested: {bar: 2}
})// 改变 state 本身的性质是响应式的
state.foo++
// ...但是不转换嵌套对象
isReactive(state.nested) // false
state.nested.bar++ // 非响应式

shallowRef和shallowReactive相关推荐

vue3中ref、reactive、shallowRef、 shallowReactive、toRaw、unref、toRef、toRefs、customRef使用与区别
ref ref toRef 普通ref对象特殊ref对象不会和原始对象挂钩创建的ref对象,与原始对象挂钩重新渲染不会触发渲染 -普通ref对象不会和原始对象挂钩重新渲染如下面的例子中 ...
vue3.0组件之父传子，子传父,父传孙
父组件<template> <!-- <div>{{name}}</div> {{computedsx}} {{sum}}<button @click= ...
【Vue3】李南江老师讲解--个人笔记（二）ref 和 reactive详解
[vue3笔记之 ref 和 reactive ] 实现响应式数据的方法可以使用 ref,reactive定义响应式数据,本质上就是将传入的数据包装成一个Proxy对象. 使用 reactive 必 ...
vue3 效率的提升、composition-api 和 ref 详解
vue3 效率的提升.composition-api 和 ref 详解文章目录 vue3 效率的提升.composition-api 和 ref 详解 vue3 效率的提升优化diff算法 hoi ...
VUE3对比VUE2的优势及新特性原理
1.Vue3.0新特性性能比Vue2.x快1.2~2倍原因1: diff方法优化: vue2中的虚拟dom是全量的对比(每个节点不论写死的还是动态的都会比较) vue3新增了静态标记(patchf ...
vue2升级vue3知识点
echarts自适应大小 myChart.setOption(option)window.onresize = function () {myChart.resize()} setup在create之 ...
历时一个月！50+Vue经典面试题详解，值得收藏！
大家好,我是若川.持续组织了8个月源码共读活动,感兴趣的可以点此加我微信ruochuan12 参与,每周大家一起学习200行左右的源码,共同进步.同时极力推荐订阅我写的<学习源码整体架构系列& ...
vue2+vue3天禹老师版复习笔记
文章目录 1.Vue2基础 1.1.初始Vue 1.2.模板语法 1.3.数据绑定 1.4.MVVM模型 1.5.el和data的两种写法 1.6.回顾defineProperty方法 1.7.数据代 ...
Vue3的新特性变化，上手指南！
文章目录一.Vue3相比Vue2,更新了什么变化? 二.Proxy 代理响应式原理三.组合式 API (Composition API) setup()函数: ref()函数 reactive() ...

shallowRef和shallowReactive

一，前言

二，`shallowRef`介绍

三，`shallowReactive`介绍

shallowRef和shallowReactive相关推荐

最新文章

热门文章

shallowRef和shallowReactive

一，前言

二，shallowRef介绍

三，shallowReactive介绍

shallowRef和shallowReactive相关推荐

最新文章

热门文章

二，`shallowRef`介绍

三，`shallowReactive`介绍