Why Data Must Be a Function in Vue

When working with Vue, you might find yourself asking the question, “Why must data be a function that returns an object, instead of just an object?” Consider the following example: <template> <a v-on:click="counter = counter + 1">{{counter}}</a> </template> <script> export default { data: function() { return { counter: 0 } } } </script> You may have also noticed that in some places, data is not a function, such as in the App component in various examples....