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)   }) })

完整代码

   

相关内容

热门资讯

原创 告... iQOO Z11 Turbo,作为2026年1月发布的全新手机,凭借其强悍的硬件配置和综合表现,迅速...
东莞立讯技术申请连接器组件专利... 国家知识产权局信息显示,东莞立讯技术有限公司申请一项名为“连接器组件”的专利,公开号CN121355...
小米18系列全球首发!高通骁龙... 快科技1月17日消息,台积电2nm技术已按计划于2025年第四季度投入量产,标志着先进芯片制程正式迈...
如何精准清除“致病蛋白”?我国... 生命体如同一台精密运转的机器,蛋白质作为生命体的核心“零部件”,其表达、功能与清除的精准调控是维持生...
新华解码|推动工业用能低碳转型... 新华社北京1月16日电 题:推动工业用能低碳转型 绿色微电网建设如何发力? 新华社记者周圆 工业和信...