Parentheses while calling a method in Vue

by

This is explained pretty well in https://v2.vuejs.org/v2/guide/events.html#Method-Event-Handlers.

Basically, the event handler can be either

  • a method name, such as @input="changeName"
  • a valid Javascript statement, such as @input="changeName()" or @input="userName="Name "+Math.random()"

Vue performs checking automatically to detect which case it is.

If you interested, checkout out this core codes at https://github.com/vuejs/vue/blob/19552a82a636910f4595937141557305ab5d434e/dist/vue.js#L10086 .

var handlerCode = isMethodPath
  ? ("return " + (handler.value) + "($event)")
  : isFunctionExpression
    ? ("return (" + (handler.value) + ")($event)")
    : handler.value;

More Related Contents:

  1. Vue.js dynamic images not working
  2. Vuejs Error: The client-side rendered virtual DOM tree is not matching server-rendered
  3. Communication between sibling components in Vue.js 2.0
  4. Vuex state on page refresh
  5. Vuejs and Vue.set(), update array
  6. [Vue warn]: Property or method is not defined on the instance but referenced during render
  7. How to watch store values from vuex?
  8. NavigationDuplicated Navigating to current location (“/search”) is not allowed
  9. How to listen for ‘props’ changes
  10. Passing props dynamically to dynamic component in VueJS
  11. Accessing Vuex state when defining Vue-Router routes
  12. Vue JS: Difference of data() { return {} } vs data:() => ({ })
  13. Vue.js: Conditional class style binding
  14. Is there any way to ‘watch’ for localstorage in Vuejs?
  15. how to fix ‘Access to XMLHttpRequest has been blocked by CORS policy’ Redirect is not allowed for a preflight request only one route
  16. VueJS/Typescript – Cannot find module ‘./components/Navigation’ or its corresponding type declarations
  17. Access vue instance/data inside filter method
  18. Vue v-on:click does not work on component
  19. Methods vs Computed in Vue
  20. Passing props with programmatic navigation Vue.js
  21. How to set a component non-reactive data in Vue 2?
  22. Vue.js – update router view
  23. How to use Vuetify tabs with vue-router
  24. Force download GET request using axios
  25. Importing javascript file for use within vue component
  26. Detect Back Button in Navigation Guards of Vue-Router
  27. When should I use Vuex?
  28. VueJS conditionally add an attribute for an element
  29. Vue.js – Add class to clicked button
  30. What’s the correct way to pass props as initial data in Vue.js 2?

Leave a Comment