vue3中props,watch,computed与vue2的区别

本文介绍了Vue3中`setup`生命周期钩子的使用,如何在setup中处理props,并对比了与Vue2的区别。同时,详细讲解了Vue3中的watch、computed函数式书写方式,以及props通过proxy实现的数据响应。通过对Vue3新特性的深入理解,帮助开发者更好地适应和利用这些变化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

props
在vue2中我门需要这样定义和使用

props:['msg']
  console.log(this.$props.msg)

vue3需要这样

    props:['msg'],
    setup(props){
        console.log(props)
    }

vue3引入的setup生命周期钩子,让methods,钩子,watch,computed做了一个整合。类似React的函数式组件,
在setup中使用props它的底层是proxy来做数据响应。

watch和vue2本质上没什么区别

    const numbers = ref('')
  
    watch(numbers,(newValue) => {
        console.log(newValue)
    },{
        deep:true,
        immediate:true
    })

computed用函数式书写

    let addNum = computed({
      get() {
        return num.value + 1;
      },
      set(v) {
        return v
      },
    });
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值