vue3 如何通过一个方法触发点击事件

本文介绍了如何在Vue应用中,通过一个btn按钮的点击事件触发model框上的ok按钮,进而操作form表单。重点讲解了如何使用ref和v-model来实现不同组件间的事件交互。
摘要由CSDN通过智能技术生成

需求:在通过一个btn按钮触发另外一个按钮的点击事件。达到点击ok(model框按钮),触发create(form表单)按钮的事件

<!-- 1.首先通过ref创建了一个名为linkRef的引用变量,并将其初始化为null。 -->

      <a-button type="primary" @click.prevent="onSubmit" ref="btnRef">Create</a-button>

2.在model框上定义ok框的点击事件

<a-modal v-model:visible="visible" title="title" @ok="handleOk" @cancel="resetForm">

3.使用$el属性访问DOM元素并触发其点击事件

js

form表单的事件

const onSubmit = ()=》{}

model框的事件

const handleOk = () => {

  visible.value = false;

  btnRef.value.$el.click()

};

vue2 的写法:this.$refs.btnRef.click()

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值