Reactive判断的API

devtools/2024/12/21 22:19:27/

Reactive判断API

      • 1. isProxy
      • 2. isReactive
      • 3. isReadonly
      • 4. toRaw
      • 5. shallowReactive
      • 6. shallowReadonly

1. isProxy

    检查对象是否是由reactive或readonly创建的proxy.
  	const info1 = reactive({name:'why',age:18})const info2 = readonly(reactive({name:'why',age:18}))console.log(isProxy(info1),isProxy(info2));//true true

2. isReactive

     检查对象是否由reactive创建的响应式代理:如果该代理是readonly创建的,但包裹了由reactive创建的另一个代理,它也会返回true
  	const info1 = reactive({name:'why',age:18})const info2 = readonly(reactive({name:'why',age:18}))console.log(isReactive(info1),isReactive(info2));//true true

3. isReadonly

      检查对象是否由readonly创建的只读代理。
  	const info1 = readonly({name:'why',age:18})const info2 = readonly(reactive({name:'why',age:18}))console.log(isReadonly(info1),isReadonly(info2));//true true

4. toRaw

      返回reactive或readonly代理的原始对象(不建议保留对原始对象的持久引用。谨慎使用(转成原始对象之后是要修改原始对象不推荐))
      const info1 = readonly({name:'why',age:18})const info2 = reactive({name:'why',age:18})console.log(toRaw(info1),toRaw(info2)); //{name: 'why', age: 18} {name: 'why', age: 18}

5. shallowReactive

      创建一个响应式代理,它跟踪其自身property的响应性,但不执行嵌套对象深层响应式转换(深层还是原生对象)注意点:修改后视图不刷新。修改carName的时候,不能把其他响应式数据也放到里面,不然会带着一起修改视图
		<template><div><h2>{{ info.car.name }} //视图不更新</h2><button @click="chagneCarName">修改carName</button></div></template>const info = shallowReactive({name:'why',age:18,car:{name:'xx'}})const chagneCarName = () => {info.car.name = 'yy'}

6. shallowReadonly

      创建一个proxy,使其自身的property为只读,但不执行嵌套对象的深度只读转换(深层还是可读、可写)
      const user = shallowReadonly({name: 'Alice',address: {street: '123 Main St',city: 'Wonderland',}})const changName = () => {user.name = '456 Elm St'; // 视图不会更新}

http://www.ppmy.cn/devtools/2028.html

相关文章

好用且免费的Chat+GPT (文生文) AI工具推荐

文章目录 一、国外1. ChatGPT2. Gemini(双子座) 二、国内1. 文心一言2. 通义千问3. 扣子4. 智谱清言5. 月之暗面&#xff08;kimi&#xff09;6. 讯飞星火7. 豆包 一、国外 1. ChatGPT 简介&#xff1a; ChatGPT&#xff08;全名&#xff1a;Chat Generative Pre-trained Tra…

数据结构—顺序表实现通讯录

在上一节我们基本了解了顺序表的基本知识&#xff0c;接下来我们就用顺序表来实现一下通讯录。 一、基于动态顺序表实现通讯录 1.1 功能介绍 1. 能够保存用户信息&#xff1a;姓名&#xff0c;性别&#xff0c;年龄&#xff0c;电话&#xff0c;地址等 2. 添加联系人信息 3. …

熟练使用Nacos、GateWay、OpenFeign、Sentinel常用组件

Nacos 面试题&#xff1a; 请简述Nacos是什么&#xff0c;它主要解决了什么问题&#xff1f;Nacos提供了哪些核心功能&#xff1f;Nacos是如何支持服务发现的&#xff1f;如何使用Nacos作为配置中心&#xff1f;Nacos的集群部署是如何实现的&#xff1f; 答案&#xff1a; …

华为OD-C卷-执行任务赚积分[100分]C++ 100%

题目描述 现有N个任务需要处理,同一时间只能处理一个任务,处理每个任务所需要的时间固定为1。 每个任务都有最晚处理时间限制和积分值,在最晚处理时间点之前处理完成任务才可获得对应的积分奖励。 可用于处理任务的时间有限,请问在有限的时间内,可获得的最多积分。 输…

【Linux实践室】Linux高级用户管理实战指南:Linux用户与用户组编辑操作详解

&#x1f308;个人主页&#xff1a;聆风吟_ &#x1f525;系列专栏&#xff1a;Linux实践室、网络奇遇记 &#x1f516;少年有梦不应止于心动&#xff0c;更要付诸行动。 文章目录 一. ⛳️任务描述二. ⛳️相关知识2.1 &#x1f514;Linux查看用户属性命令2.1.1 &#x1f47b;…

【opencv】示例-videocapture_starter.cpp 从视频文件、图像序列或连接到计算机的摄像头中捕获帧...

/** * file videocapture_starter.cpp * brief 一个使用OpenCV的VideoCapture与捕获设备&#xff0c;视频文件或图像序列的入门示例 * 就像CV_PI一样简单&#xff0c;对吧&#xff1f; * * 创建于: 2010年11月23日 * 作者: Ethan Rublee * * 修改于: 2013年4月17日 * …

从iPhone恢复已删除照片的最佳软件

本文分享了从iPhone恢复已删除照片的最佳软件。如果您正在寻找如何从iPhone恢复已删除的照片&#xff0c;请查看这篇文章。 为什么您需要软件从iPhone恢复已删除的照片&#xff1f; 没有什么比丢失iPhone上的重要数据更痛苦的了&#xff0c;尤其是一些具有珍贵回忆的照片。有时…

Avi Wigderson:重塑计算随机性的理论巨匠

Avi Wigderson&#xff1a;重塑计算随机性的理论巨匠 在计算科学领域&#xff0c;Avi Wigderson教授是一个响亮的名字&#xff0c;他的贡献不仅在于推动了理论的边界&#xff0c;更在于其实用性和对后续研究的深远影响。近日&#xff0c;Wigderson荣获了图灵奖&#xff0c;这无…