Vue组件中data必须是一个函数

Vue组件中data属性不能为对象原因是对象是引用类型，组件会被多个实例同时引用导致的结果就是多个实例共享一个对象，其中一个组件改变了data对象中的值，其他实例也会受到影响。

如图所示，组件复用后，随机点击其中一个组件中的按钮其他两个组件的数值也会受到影响

在这里插入图片描述

vue组件data为函数的原因：data为函数，通过return返回对象，可以实现每个实例都有自己独立的对象，实例之间互不影响；如下图所示

在这里插入图片描述