Vue3父子组件传参

1.非语法糖能直接在setup里添加两个参数props和ctx里的emit传参

具体语法:setup(props,ctx)

1.之后使用可以通过props.xxx(xxx为父组件传递过来的属性名)进行数据的使用

2.ctx:可以直接解构赋值将emit解构出来使用语法规范和Vue2的emit使用差不多

子组件解构出emit

绑定事件

通过自定义事件传值

打印出它 也可以使用

(注:ctx中还有两个属性,一个为attrs用于获取当前标签上的所有属性的对象,还有一个为slots用于获取插槽)

  

2.语法糖形式:

1.父组件给子组件传递参数(props)

绑定数值后通过defineProps接收使用 

(父组件)

(子组件)

2子组件给父组件传递参数(emit)

通过defineEmits来挂载自定义方法去传值

(子组件)

(父组件)

小知识点:

可通过绑定一个ref给子组件然后子组件通过defineExpose给父组件传递出去让父组件能直接修改子组件的值

 

可通过defineProps添加默认值(注:此处写了defineProps 之前就不用写)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值