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

vue3: toRef, reactive, toRefs, toRaw

vue3: toRef, reactive, toRefs, toRaw

扫码或者点击文字后台提问
在这里插入图片描述

<template><div>{{ man }}</div><hr><!-- <div>{{ name }}--{{ age }}--{{ like }}</div> --><div><button @click="change">修改</button></div>
</template>
<script setup lang='ts'>
import { toRef, reactive, toRefs, toRaw } from 'vue';
/*** toref: 只能修改响应式对象的值,非常响应式视图毫无变化。* torefs: 将解构后的对象,声明为响应式的ref。* toRaw:将响应式对象 为一个普通的对象*/const man=reactive({name:"小田",age:23,like:"JK"})
// const like=toRef(man,"name");// const {name,age,like} = toRefs(man)
const change = ()=> {// like.value="洛丽塔"// console.log(man);// name.value="小田田"// console.log(name,age,like);console.log(man,toRaw(man));}
</script>
<style scoped></style>

http://www.mrgr.cn/news/76371.html

相关文章:

  • 芯片:CPU和GPU有什么区别?
  • SQL刷题快速入门(二)
  • asammdf python 处理MF4文件库简介
  • 现代企业架构白皮书(可以在线阅读完整PDF文件)
  • C++例程:使用I/O模拟IIC接口(6)
  • T-SQL语言的网络编程
  • linux下编译安装memcached
  • Android ART知多少?
  • 《抽象类和接口》
  • 渗透测试之信息收集 DNS主机发现探测方式NetBIOS 协议发现主机 以及相关PorCheck scanline工具的使用哟
  • 跳房子(弱化版)
  • 芯原科技嵌入式面试题及参考答案
  • cMake编译github中源码
  • flink cdc 应用
  • 重建大师跑空三,出现进度条回退是什么原因?
  • 城市轨道交通数据可视化的应用与优势
  • Intelligent Transportation Scheduling
  • IT框架与库:理解它们的不同与共同点
  • 用友YonBIP-R5旗舰版 yonbiplogin 任意文件读取漏洞复现
  • Rust 语言学习笔记(一)
  • uniapp luch-request 使用教程+响应对象创建
  • C++ 20的条件判断语句的增强
  • Docker 容器常见故障排查及处理
  • JavaWeb后端开发知识储备1
  • 大型网站架构演进过程
  • Istio分布式链路监控搭建:Jaeger与Zipkin