An article teaches you how to use Vue's watch listener

Listener watch

• The function name is the name of the element to listen to.
• The first parameter passed in is the new value newval after the change, and the second is the old value oldval before the change

Format

Listener in method format

• It cannot be triggered automatically when entering the page. It will only be triggered when changes are detected.
• If you listen to an object, you will not hear when the object's properties change.

Object format listener

• The immediate option allows the listener to be triggered automatically
• The deep option allows the listener to listen deeply to changes in the properties of the object.

This is the data object in the Vue instance:

Set up the listener:

The following are listeners in method format and listeners in object format:

The listener in method format is implemented by triggering the listener when the content in the input changes, listening to the content in the input (the content is bound to the term). If the content in the current input is not in the already array, it is added to the already array, otherwise a prompt box pops up to indicate that the name already exists.

The object-format listener is implemented by triggering the listener immediately once the page is loaded, listening for changes in the name attribute of the foo object.

Summarize

This article ends here. I hope it can be helpful to you. I also hope you can pay more attention to more content on 123WORDPRESS.COM!