How to monitor the change of an attribute value in Vue

Editor to share with you how to monitor the change of an attribute value in Vue, I believe most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

How to monitor the change of an attribute value in Vue

For example, now you need to monitor the changes in obj.an in data. To monitor changes in object properties in Vue, you can do this:

Watch: {obj: {handler (newValue, oldValue) {console.log ('obj changed')}, deep: true}}

The deep attribute represents a deep traversal, but writing this will monitor all property changes of the obj, which is not what we want, so make some changes:

Watch: {'obj.a': {handler (newName, oldName) {console.log (' obj.a changed')}

There is another way to do this through computed, just:

Computed: {A1 () {return this.obj.a}}

Using the properties of the computed property, when the dependency changes, a new value is recalculated.

The above is all the contents of the article "how to monitor the change of an attribute value in Vue". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!