Vue组件的data为什么必须是函数

【 学习探索过程中记下的点点笔记，以供分享，欢迎大家一起学习探讨～如有雷同可附链接，谦虚学习！】

简单来说——主要是为了避免组件间的数据相互影响。

具体原因：这是由于JS本身的特性带来的。

1. 如果data是一个对象，那么由于对象本身属于引用类型，当我们修改其中的一个属性时，会影响到所有vue实例的数据。
2. 如果将data作为一个函数返回一个对象，那么每个实例的data属性都是独立的，不会相互影响。

同一组件被复用多次，会创建多个实例，这些实例用的是同一构造函数。如果data是一个对象的话，那么所有组件都共享了同一个对象。为了保证组件的数据独立性，要求每个组件必须通过data函数返回一个对象作为组件的状态。

为了保证组件间的不同实例data不冲突，要求data必须是一个函数，这样组件间就不会相互影响。