Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to use watch function in typescript language Vuejs?

I need to change this script from js to ts but i need syntax of watchers

export default {
    props: ['branch_id'],
    watch: {}
}
like image 967
mai elrefaey Avatar asked Dec 19 '19 10:12

mai elrefaey


People also ask

How does watch work in Vuejs?

A watcher in Vue is a special feature that allows us to observe some data and perform specific actions when it changes. It is a more generic way to observe and react to data changes in the Vue instance.

How do you watch objects in Vue?

Deep watcher over array of objects. vue , we have to import it in the App. vue file and pass users as a prop . In User. vue , we are using watcher over the value which is changing and we are also using user.name property instead of user so that vue can detect the change happening to user.name .

Can you use Vue with TypeScript?

Vue is written in TypeScript itself and provides first-class TypeScript support. All official Vue packages come with bundled type declarations that should work out-of-the-box.

What is REF () in Vue?

ref is a special attribute, similar to the key attribute discussed in the v-for chapter. It allows us to obtain a direct reference to a specific DOM element or child component instance after it's mounted.


1 Answers

First you have to declare your variable, like myProperty in this case, and then you have to make a @Watch('myProperty') to make the actual watcher for that specific variable.

@Component
export default class App extends Vue {
  myProperty: string

  @Watch('myProperty')
  onPropertyChanged(value: string, oldValue: string) {
    // Do stuff with the watcher here.
  }
}
like image 186
Jesper Avatar answered Sep 17 '22 17:09

Jesper