The usefulness of reactivity in Vue can be described in terms of the difference between computed properties and methods.
As we mentioned earlier, a Vue instance can have either computed properties, methods, or both computed properties and methods. So, what is the difference between the two?
Methods are simply run every time they are called. On the other hand, computed properties are cached, meaning they are only run when the underlying data model changes. This is often described in terms of computed property dependencies. Also, methods can have parameters, whereas computed properties cannot.
Consider this simple Vue app, available as a pen at this link: https://codepen.io/AjdinImsirovic/pen/qKVyry.
This is the code of the simple app:
<!--HTML--> <div id="example"> <p>Enter owner name and the thing that is owned: <input v-model="ownerName" placeholder="enter owner"> <input v-model="thing" placeholder...