[vue] 为什么data属性必须声明为返回一个初始数据对应的函数呢?
Activity
wenyejie commentedon Jun 17, 2019
公司的面试题中也有这么一题
如果是公共组件确实必须要返回一个函数,
但是如果不是可以直接一个对象
因为没有执行函数return之后返回的都是一个全新的对象(类似于工厂模式的设计思想),
虽然我们一样, 但是我们又没有关系. 避免数据混淆
chenjinWeb commentedon Jul 25, 2019
对象为引用类型,当重用组件时,由于数据对象都指向同一个data对象,当在一个组件中修改data时,其他重用的组件中的data会同时被修改;而使用返回对象的函数,由于每次返回的都是一个新对象(Object的实例),引用地址不同,则不会出现这个问题。
Ricemonster commentedon Jul 26, 2019
防止组件复用数据,data必须为一个函数,因为实例可以维护一份被返回对象的独立的拷贝
Ricemonster commentedon Jul 26, 2019
说的好
DoubleBlock commentedon Sep 27, 2019
学习了
coymaple commentedon Sep 16, 2020
往简单了说,是为了阻止相同vue组件之间共享data。往复杂了说,js引擎在编译代码的时候,会尝试为所有import引入的模块分配地址,相同的模块只会分配一次地址,执行时按照引用取值,同样的引用拿到的对象是一样的,其内部的data属性也是一样的。dat改成函数以后,每次 return 都会重新分配内存创建新对象,就不存在同样的引用这个问题。
lly-ak47 commentedon Nov 11, 2020
确保每个组件独享一个数据对象,而不是共享一个数据对象
crush2020 commentedon Feb 2, 2021
@chenjinWeb
大佬厉害,这回答我瞬间清晰了
xiqi99520 commentedon Feb 9, 2021
因为以函数形式定义,每次引用都会是全新data对象,有效规避多实例之间状态污染问题。
yxllovewq commentedon Mar 9, 2022
对象直接赋值,得到的是数据存储的地址,修改会触发连锁反应
通过工厂函数,会返回新的对象
Cai-zhiji commentedon Jul 7, 2023
在Vue中,将data属性声明为返回一个初始数据对应的函数是为了确保每个组件实例都拥有独立的数据副本。
当一个组件被定义时,它可能会被多次实例化,例如在多个地方重复使用。如果直接将data属性声明为一个对象,那么所有该组件的实例将共享相同的数据引用。这意味着,当一个实例修改数据时,其他实例也会受到影响,导致数据的不可预测性和混乱。
通过将data属性声明为一个返回初始数据的函数,每个组件实例都会调用该函数来获取独立的数据副本。这样每个实例都有自己的数据,它们之间互不干扰,保证了数据的独立性和可预测性。