Vue3.5与Vue3新功能对比
创始人
2024-09-25 04:49:45

一、props解构,默认值

vue3

const { count = 0, message = 'hello' } = withDefaults(   defineProps<{     count?: number     message?: string   }>(),   {     count: 0,     message: 'hello'   } )

vue3.5 

const { count = 0,message = 'hello'} =  defineProps<{   count?: number;   message?: string; }>()

二、useId

全局唯一id-----一个app内 

const id = useId()

三、useTemplateRef

通过ref获取dom

vue3

const button = ref(null)

vue3.5 

const el = useTemplateRef('button') console.log(el, 'dom')

四、watch新增 onCleanup回调

vue3.5

onCleanup---下一次watch执行前触发---可以在这里移除上一次watch

watch(count, (newVal, oldVal, onCleanup) => {   const handler = () => {     console.log(newVal, 'newVal')   }   addEventListener('click', handler)   onCleanup(() => {     removeEventListener('click', handler)   }) })

完整代码

   

相关内容

热门资讯

2025年建筑工程模块化设计软... 在降本增效、提升建筑品质成为行业核心诉求的今天,建筑工程模块化设计已从一种前沿理念转变为势在必行的实...
太阳净辐射传感器:太阳净辐射传... 但作为科研的前沿与能源的支撑者,精准的太阳辐射数据就如同一道不可或缺的起点,其所对应的太阳净辐射传感...
华为手机流量卡用不了,华为手机... 办卡关注 微 信 公 众 号 :找卡乐园 这里是专为你打造的流量卡服务站,既能帮你揭开流量卡市场的各...
让AI做老师的帮手!南都智慧校... 一线教师统计成绩还在手动计算、反复核对?写招生宣传稿半天没思路?南都AIGC培训基地来为一线教师排忧...
星辰不落处 山海有回声 冬日的清华园,梧桐褪尽华叶,天地一片清肃。 12月10日下午,深切的缅怀之情萦绕在清华大学主楼接待厅...