【问题标题】:Vue 2 arguments in inline (in-template) event handler内联(模板内)事件处理程序中的 Vue 2 参数
【发布时间】:2016-11-08 07:55:49
【问题描述】:

是否可以访问传递给内联/模板内处理程序中已发出事件的参数/参数?比如:

<component @some-event="someObject.field = $arguments[0]"></component

我要做的就是为范围内的对象分配一个值。我知道我可以创建一个方法来执行此操作并将其用作事件的处理程序,但我想知道这是否可以用作内联语句。

【问题讨论】:

    标签: vue.js


    【解决方案1】:

    不是$arguments[0],而是arguments[0](没有$)。我很惊讶它实际上可以在内联处理程序中工作。所以下面的代码是有效的并且可以工作:

    <component @some-event="someObject.field = arguments[0]"></component>
    

    Methods in Inline Handlers 的文档将 $event 指定为一个特殊变量,它获取通过事件传递的第一个参数。一直用到现在。

    在阅读了您的问题后,更多的研究使我找到了这个参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments

    似乎每个 javascript 函数都有一个名为 arguments 的局部变量,当函数需要获取可变数量的参数时使用它。

    使用arguments[] 作为内联语句绝对是可能的,但在 vue.js 框架的上下文中没有任何文档记录。另一方面,如果你在事件的内联处理程序中使用$event,感觉更安全,因为它被清楚地记录并且不会在未来版本的 Vue.js 中中断

    $event 的示例用法:

    <component @some-event="someObject.field = $event"></component>
    

    【讨论】:

      【解决方案2】:

      有些事情不是很多人知道的。 除了$event 之外的内联处理程序可以访问arguments。

      例如,我使用的是v-dropzone,它传递了许多参数(例如文件、响应)。

      通过使用

      <v-dropzone @some-event="callMethod($event, 'some other arg')" >
      

      只会捕获第一个参数。

      所以解决办法是:

      <v-dropzone @some-event="callMethod(arguments, 'some other arg')" >
      

      【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-04-30
      • 2013-02-02
      • 1970-01-01
      • 2022-07-24
      • 2011-03-28
      • 2012-10-13
      • 2015-07-13
      相关资源
      最近更新 更多