Vue $将参数传递给已经有参数的函数

时间:2018-04-09 09:12:52

标签: javascript vue.js vuejs2

我的组件中有这个:

template: <input @blur="$emit('customEvent', arg1)" v-model="arg1">

这在我的html模板中:

<component @customEvent="method1(arg2)"></component>

我需要向arg2函数提供参数(method1()),同时我需要从arg1获取$emit()

我试过这个(进入Vue实例):

method1(arg2, arg1) {
      console.log("This is the arg2: " + arg2);
      console.log("This is the arg1: " + arg1);
    }

当然,我试图扭转它们,而不是工作,arg1没有通过,而是被替换。

我知道它必须有一个名称空间(可能类似arg1=arg1),但我没有找到这样的东西。

1 个答案:

答案 0 :(得分:12)

$event传递给方法可以起作用。

$event将是您在emit函数中传递的有效负载。当您执行$emit('customEvent', arg1)时,arg1将作为$event传递给@customEvent。

<component @customEvent="method1($event, arg2)"></component>

和方法:

method1(arg1, arg2) {
  console.log("This is the arg2: " + arg2);
  console.log("This is the arg1: " + arg1);
}

概念证明:https://jsfiddle.net/jacobgoh101/e8a5k3ph/1/