vue3事件的第一个参数为event,第二个参数为用户自定义参数,怎么传才能不影响event

vue3事件的第一个参数为event,第二个参数为用户自定义参数,怎么传才能不影响event
用户857365697
2023年10月28日
|
浏览 197
前端

在Vue 3中,可以通过$event特殊变量来传递用户自定义参数,以避免影响event参数。示例如下:

复制代码
<template>
  <button @click="handleClick($event, customParam)">Click me</button>
</template>

<script>
export default {
  methods: {
    handleClick(event, customParam) {
      // 在这里处理点击事件,并可以使用event和customParam
    }
  }
}
</script>

在上面的例子中,$event表示事件对象,customParam是用户自定义的参数。在handleClick方法中,你可以使用eventcustomParam来进行相应的处理。这样就能够传递用户自定义参数而不影响event参数了。

我要提问
复制内容
分享给好友
AI编程问答网 免责声明:
以上内容除特别注明外均来源于网友提问,AI编程问答网回答,权益归原著者所有;
 
下一篇:如何优化这段代码? <template> <view class="max-w-xl m-auto pb-[80px]"> <v-nav-bar title="企业信息" left-text="返回" back-url="/pages/index/index" /> <view class="pt-3 px-3"> <uni-forms :model="formData" label-position="top" :label-width="150"> <uni-forms-item label="主要负责人持证" name="principal_certificate"> <u-upload :fileList="formData.principal_certificate" @afterRead="afterRead1" @delete="deletePic1" :maxCount="1" :previewFullImage="true" /> </uni-forms-item> <uni-forms-item label="安全管理机构" name="safety_management_agency_upload"> <u-upload :fileList="formData.safety_management_agency_upload" @afterRead="afterRead2" @delete="deletePic2" :maxCount="1" :previewFullImage="true" /> </uni-forms-item> <uni-forms-item label="营业执照" name="business_license_code"> <u-upload :fileList="formData.business_license_code" @afterRead="afterRead3" @delete="deletePic3" :maxCount="1" :previewFullImage="true" /> </uni-forms-item> <view class="h-[38px] leading-[38px] mx-14 mt-10"> <up-button :throttleTime="1000" type="primary" text="提交" @tap="onSubmit" data-eventsync="true" /> </view> </view> </view> <v-tabbar /> </template> // 表单数据 const formData = reactive({ principal_certificate: [], safety_management_agency_upload: [], business_license_code: [], industry_qualification: [], flat: [], business_scope_img: [], safety_officer_certificate: [], safety_license: [], emergency_record_license: [], live_photos: [], emergency_evacuation: [] }) const files = reactive({ list1: [], list2: [], list3: [], list4: [], list5: [], list6: [], list7: [], list8: [], list9: [], list10: [], list11: [] }) // 主要负责人持证 const afterRead1 = async (event) => { try { uni.showLoading({ title: "请稍后..." }) const result = await uploadFile(event.file.url) files.list1.push({ url: result.url }) formData.principal_certificate.push(result.url) } catch (error) { console.log(error) } finally { uni.hideLoading() } } const deletePic1 = (event) => { files.list1.splice(event.index, 1) formData.principal_certificate.splice(event.index, 1) } // 安全管理机构 const afterRead2 = async (event) => { try { uni.showLoading({ title: "请稍后..." }) const result = await uploadFile(event.file.url) files.list2.push({ url: result.url }) formData.safety_management_agency_upload.push(result.url) } catch (error) { console.log(error) } finally { uni.hideLoading() } } const deletePic2 = (event) => { files.list2.splice(event.index, 1) formData.safety_management_agency_upload.splice(event.index, 1) } // 营业执照 const afterRead3 = async (event) => { try { uni.showLoading({ title: "请稍后..." }) const result = await uploadFile(event.file.url) files.list3.push({ url: result.url }) formData.principal_certificate.push(result.url) } catch (error) { console.log(error) } finally { uni.hideLoading() } } const deletePic3 = (event) => { files.list3.splice(event.index, 1) formData.principal_certificate.splice(event.index, 1) }