$watch multiple properties for single callback
See original GitHub issueWhat do you think about being able to $watch
over an array of data properties for a given callback?
$watch(['x', 'y', 'z'], function() {
// do something
});
// or
$watch('x', 'y', 'z', function() {
// do something
});
Not exactly pressing as I can easily make do with multiple $watch
statements.
Issue Analytics
- State:
- Created 8 years ago
- Reactions:12
- Comments:27 (6 by maintainers)
Top Results From Across the Web
vue js watch multiple properties with single handler
Using vue 2 and composition-api plugin, It works with a function returning an array of values to watch: watch(() => [a, b], ....)...
Read more >Watch multiple properties, run a callback once - Vue Forum
A watcher (and computed property for that matter) is designed to run anytime the variable(s) it watches changes. The only way around this...
Read more >How to watch multiple properties from Vuex in a single watcher?
How to watch multiple properties from Vuex in a single watcher? I have filter, search and tag being stored in Vuex state.
Read more >Vue — Watch only once - Level Up Coding
The problem is that I only want to watch the property as long as it is not changed. Otherwise the websocket connection will...
Read more >Deep dive into the Vue Composition API's watch() method
The watch API is part of the larger Vue Composition APIs. It takes a data source and a callback function that executes when...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
For this, I would just build a computed property which is derived from your desired properties, then watch that:
UPDATE To skip the performance penalty of allocating and discarding an array, you can comma-separate all the dependent values, and finally return something that will always be different (
Date.now()
taking from comments below this):Some linters might complain, but it’s perfectly valid JS.
FYI you can directly watch a getter via
$watch
without the need for a separate computed property:https://vuejs.org/v2/api/#vm-watch