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

完整代码

   

相关内容

热门资讯

“刷脸”通关满月,虹桥机场口岸... 自今年11月5日智能通关服务在上海虹桥机场口岸正式推广应用以来,该项便民举措已平稳运行满一个月。 作...
我国成功发射交通VDES卫星A... 12月5日17时00分,我国在酒泉卫星发射中心使用快舟一号甲运载火箭,成功将交通VDES卫星A星、B...
5G+AI赋能智慧医疗 在家与... 5G+AI赋能智慧医疗 在家与专家“面对面”就诊 淄博市第一医院携手淄博移动 “电视问诊”服务正式上...
大模型可信知识服务技术厂商彩智... 来源:猎云网 近日,大模型可信知识服务技术厂商彩智科技完成数千万级A轮融资,本轮融资由国内智能协同运...
松山机械申请一种排辊式薄膜自动... 国家知识产权局信息显示,浙江松山机械有限公司申请一项名为“一种排辊式薄膜自动收卷装置”的专利,公开号...