Just a few weeks until the 2021 JavaScript Full-Stack Bootcamp opens.
Signup to the waiting list!
When to use methods
- To react on some event happening in the DOM
- To call a function when something happens in your component. You can call a methods from computed properties or watchers.
When to use computed properties
- You need to compose new data from existing data sources
- You have a variable you use in your template that’s built from one or more data properties
- You want to reduce a complicated, nested property name to a more readable and easy to use one, yet update it when the original property changes
- You need to reference a value from the template. In this case, creating a computed property is the best thing because it’s cached.
- You need to listen to changes of more than one data property
When to use watchers
- You want to listen when a data property changes, and perform some action
- You want to listen to a prop value change
- You only need to listen to one specific property (you can’t watch multiple properties at the same time)
- You want to watch a data property until it reaches some specific value and then do something
Download my free Vue Handbook
The 2021 JavaScript Full-Stack Bootcamp will start at the end of March 2021. Don't miss this opportunity, signup to the waiting list!
More vue tutorials:
- An overview of Vue.js
- The Vue.js CLI: learn how to use it
- The Vue.js DevTools
- Configuring VS Code for Vue Development
- Create your first app with Vue.js
- Vue.js Single File Components
- Vue.js templates and interpolations
- Vue.js Directives
- Vue.js Methods
- Vue.js Computed Properties
- Styling Vue.js components using CSS
- Vue.js Watchers
- Vue methods vs watchers vs computed properties
- Vue.js Filters
- Vue.js Components
- Vue.js Slots
- Vue.js Component Props
- Vue.js Events
- Vue.js Components Communication
- Vuex, the Vue.js State Manager
- Vue, use a component inside another component
- Vue, how to use a prop as the class name
- How to use SCSS with Vue.js Single File Components
- Using Tailwind with Vue.js
- The Vue Router
- Dynamically show a Vue component
- The Vue.js Cheat Sheet
- Store Vue data to localStorage using Vuex
- How to dynamically apply a class using Vue
- Vue, how to use v-model
- Vue, why data must be a function
- Roadmap to become a Vue.js developer in 2020