[Vuejs]-How context bind on click in vue?

by

1👍

✅

By default, left-click triggers the @click event, and right-click triggers the @contextmenu event, so similar to native JavaScript, you only need to declare the function to be executed when the event occurs.

In the methods section, you declare functions within an object, so you just need to use commas between the functions instead of semicolons. Also, follow the pattern I demonstrated for the functions, but you can refer to the example in the attached documentation as well.

The example code you showed follows the structure of the Options API based on its appearance. Therefore, I will provide the example code in my response accordingly.

Example with Options API

<template>
  <div>
    <li @click="(event) => itemClick(event)">Test</li>
  </div>
</template>

<script>
export default {
  methods: {
    itemClick(event) {
      // context.someFunction(); // this doesn't make sense
      this.someFunction(); // call methods.someFunction()
    }, // <--- need use , instead of ; because methods is object, where itemClick() and someFunction() functions will elements of object
    someFunction() {
      // ...
    }
  }
}
</script>
👤rozsazoltan

Leave a comment