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

完整代码

   

相关内容

热门资讯

Krono黑白墨水屏电纸书发布... IT之家 1 月 8 日消息,荷兰公司 DuRoBo 在 CES 2026 上发布了一款名为 Kro...
奇虎科技申请会话方法专利,提升... 国家知识产权局信息显示,北京奇虎科技有限公司申请一项名为“会话方法、装置、设备、存储介质及产品”的专...
2026专业网站建设公司选哪家... 前言 步入2026年,数字化转型已进入智能化深度融合阶段,企业官网不再仅是信息展示窗口,而是演变为驱...
原创 猫... 家里猫咪正懒洋洋地趴在窗台上晒太阳,突然,一只小飞虫“嗡嗡”掠过——它的身体像弹簧一样弹起,爪子闪电...
科技前沿 | 中国空间站成功开... 记者7日获悉,中国空间站成功开展锂离子电池在轨实验,该实验旨在直接观测与解析微重力环境对电池内部关键...