(一)setup,relactive,ref,toRefs以及...的意义
2022/4/23 6:13:25
本文主要是介绍(一)setup,relactive,ref,toRefs以及...的意义,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1:对象和函数的拼接 const satate=reactive({name:"mmss",no:1}); {...toRefs(satate),Updatevalue }这里的...相当于把对象和函数拼接成了一个新对象,相当于return{no:1,Updatevalue} 2:数组间的拼接 var a=[1,2] var b=[3,4] var c=[...a,...b]后最后就是c=[1,2,3,4] 3:对象间的拼接 var a={n1:1,n2:2} var b={n3:3,n4:4} var c={...a,...b}后最后就算c={n1:1,n2:2,n3:3,n4:4} 4:经过...属性计算以后响应式就被取消了,如果还要保留响应式就必须toRefs() 5:vue3推荐把数据和方法都放在setup里面,而不是data,method里面,虽然可以这样放,但是不推荐,呢是vue2的写法 6:reactive和ref都能实现响应数据,reactive只能放对象,ref没有限制,ref还可以绑定dom元素,类似于id,通过ref获取dom元素 下面是完整测试代码: <template> <button @click="Updatevalue()">递增</button> <h1>{{ no }}</h1> </template><script> import { reactive,toRefs } from 'vue'; export default { name: "AppXx", setup(){ const satate=reactive({name:"mmss",no:1}); const Updatevalue= ()=>{ satate.no++; } return { ...toRefs(satate),Updatevalue } } } </script>
这篇关于(一)setup,relactive,ref,toRefs以及...的意义的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-15聊聊用LangChain4J构建聊天机器人的那些事儿
- 2024-11-15LangChain 和 LlamaIndex 在检索增强生成(RAG)中的大比拼:全面对比评测
- 2024-11-15平台工程不只是配置管理:超越CFEngine的方法
- 2024-11-152023年KubeCon芝加哥大会精华回顾
- 2024-11-15我花了3小时大致了解了ClickHouse
- 2024-11-15在使用平台私钥进行解密时提示 "私钥解密失败" 错误信息是什么原因?-icode9专业技术文章分享
- 2024-11-15Layui框架有哪些方式引入?-icode9专业技术文章分享
- 2024-11-15Layui框架中有哪些减少对全局环境的污染方法?-icode9专业技术文章分享
- 2024-11-15laydate怎么关闭自动的日期格式校验功能?-icode9专业技术文章分享
- 2024-11-15laydate怎么取消初始日期校验?-icode9专业技术文章分享