VUE3+TS 子对父组件传值emit

本文展示了在Vue中,使用TypeScript(TS)如何在父组件定义函数,并通过props传递给子组件。子组件可以通过调用`$emit`来触发这个函数,传递参数,实现父子组件间的通信。两种方法——直接在模板中绑定事件和在setup函数内使用emit关键字——都得到了演示。
摘要由CSDN通过智能技术生成

在父组件定义函数

TS

setup(props) {
	const onChangeValue = (value: number) => {
	    console.log('frozeRule:', value);
	};
	
	return { onChangeValue };
}

VUE

<c-child-comb @change="onChangeValue" />

子组件调用函数,emit

方式一,VUE

<div @click="(val: any) => $emit('change', val)"></div>

方式二,TS

export default defineComponent({
	emits: ['change'],
    setup(props, { emit }) {
    	const changeKey = (key: number) => {
            emit('change', key);
        };
    },
})
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值