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

问题

在vue中


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

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

按照官方说法,1和2是clickHandlere都能拿到clickevent参数。

但是如果在自定事件中,如何实现类似$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
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞