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

完整代码

   

相关内容

热门资讯

股市必读:汉威科技(30000... 截至2026年1月9日收盘,汉威科技(300007)报收于59.28元,下跌1.76%,换手率13....
原创 性... 随着智能手机不断发展,可谓是千变万化,与市场需求息息相关,所以衍生出众多新机,比如户外手机、轻薄机、...
原创 外... 文、编辑 | 白 前言 我们早已习惯黄金作为终极财富的象征,它从宇宙深处的超新星爆发与中子星碰撞中...
爱华电器取得可调节挂耳式耳机专... 国家知识产权局信息显示,广州市爱华电器科技有限公司取得一项名为“一种可调节的挂耳式耳机”的专利,授权...
脑机接口产业链,订单可见度最高... 关于报告的所有内容,请于公众『市场分析报告』阅读原文 《脑机接口产业链,订单可见度最高的13家公司》...