vue中的@xxx或者v-on:xxx传递参数的问题

2023年5月27日 255次阅读 来源: TOPro

问题

在vue中


//用法1
<component @click="clickHandler"></component>

//用法2
<component @click="clickHandler($event)"></component>
.
.
.
{
    ...
    methods:{
        clickHandler(e){}
    }
}

按照官方说法，1和2是clickHandler的e都能拿到click的event参数。

但是如果在自定事件中，如何实现类似$event这个关键字功能呢。答案官网目前并没有提及

方法

这里给出一个，不算完美的解决方法 即使用 arguments 关键字来处理

  • 组件 foo 的定义
    {
    ...
    mounted(){
        new Promise((resolve,reject)=>{
            this.$emit("mounted",resolve,reject)
        })
    }
}
  • 组件bar引用了组件foo
      {
      template:
          `<div>
              <foo @mounted="mountedHandler(arguments,name)"></foo>
          </div>
      `,
      data(){
          return{
              name:"乐园"
          }
      },
      methods:{
          mountedHandler([resolve,reject],name){
              //这里可以获取到resolve，reject和name
          }
      }
  }
    原文作者：TOPro
    原文地址: https://www.jianshu.com/p/88c4a6a48de5
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞