Übergeben von Ereignis und Argument an v-on in Vue.js.

Ich übergebe einen Parameter in v-on:inputDirektiven. Wenn ich es nicht übergebe, kann ich in der Methode auf das Ereignis zugreifen. Kann ich trotzdem auf das Ereignis zugreifen, wenn ich den Parameter an die Funktion übergebe? Nicht dass ich einen Vue-Router benutze:

Dies ist ohne Übergabe des Parameters. Ich kann auf das Ereignisobjekt zugreifen

HTML

<input type="number" v-on:input="addToCart" min="0" placeholder="0">

Javascript

  methods: {
    addToCart: function (event) {

      // I need to access the element by using event.target
      console.log('In addToCart')
      console.log(event.target)
    }
  }

Dies ist beim Übergeben des Parameters. Ich kann nicht auf das Ereignisobjekt zugreifen

HTML

<input type="number" v-on:input="addToCart(ticket.id)" min="0" placeholder="0">

Javascript

  methods: {
    addToCart: function (id) {

      // How can I access the element by using event
      console.log('In addToCart')
      console.log(id)
    }
  }

Hier ist ein Ausschnitt aus dem Code, der gut genug sein sollte, um das Problem zu replizieren, das ich habe

https://jsfiddle.net/lookman/vdhwkrmq/

Wenn Sie auch den Zugriff auf Ereignisobjekt wollen als Daten übergeben, müssen Sie passieren eventund ticket.idsowohl als Parameter, wie folgt vor :

HTML

<input type="number" v-on:input="addToCart($event, ticket.id)" min="0" placeholder="0">

Javascript

methods: {
  addToCart: function (event, id) {
    // use event here as well as id
    console.log('In addToCart')
    console.log(id)
  }
}

Siehe Arbeitsgeige: https://jsfiddle.net/nee5nszL/

Bearbeitet: Fall mit Vue-Router

Wenn Sie einen Vue-Router verwenden, müssen Sie in Ihrer Methode möglicherweise $ eventv-on:input wie folgt verwenden:

<input type="number" v-on:input="addToCart($event, num)" min="0" placeholder="0">

Hier arbeitet Geige .

Sie können auch so etwas tun ...

<input @input="myHandler('foo', 'bar', ...arguments)">

Evan Sie selbst haben diese Technik in einem Beitrag im Vue-Forum empfohlen. Im Allgemeinen können einige Ereignisse mehr als ein Argument ausgeben. Wie in der Dokumentation angegeben, ist die interne Variable $ event zum Übergeben des ursprünglichen DOM-Ereignisses vorgesehen.

Abhängig davon, welche Argumente Sie übergeben müssen, insbesondere für benutzerdefinierte Ereignishandler, können Sie Folgendes tun:

<div @customEvent='(arg1) => myCallback(arg1, arg2)'>Hello!</div>