vue中组件的data为什么是一个函数

vue中组件的data为什么是一个函数

在文档上Vue组件基础这一节中告诉我们:一个组件的 data 选项必须是一个函数

vue中组件的data为什么是一个函数

通过 Vue 构造器传入的各种选项大多数都可以在组件里用。data 是一个例外,它必须是函数。如果定义了一个对象,那么 Vue 会停止,并在控制台发出警告,告诉你在组件中 data 必须是一个函数。

为什么组件中data必须是一个函数了而不是对象?因为组件是可复用的vue实例,一个组件被创建好,就可能被用在各个地方。组件不管被复用多少次,组件中的data数据都应该相互隔离,互不影响。

当使用组件的时候,data是在构造器的原型链上被创建的,实例化后共享data。

简而言之,组件的配置(options)和实例(instance)是需要分开的。最根本原因是js对于对象(以及数组等)是传引用的,因为如果直接写一个对象进去,那么当依此配置初始化了多个实例之后,这个对象必定是多个实例共享的。