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

这篇文章给大家分享的是有关vue组件中data为什么是一个函数的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

我们提供的服务有:做网站、网站制作、微信公众号开发、网站优化、网站认证、南涧ssl等。为1000+企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的南涧网站制作公司

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

为什么组件中的 data 必须是一个函数,然后 return 一个对象,而 new Vue 实例里,data 可以直接是一个对象?

// data
data() {
  return {
 message: "子组件",
 childName:this.name
  }
}
 
// new Vue
new Vue({
  el: '#app',
  router,
  template: '',
  components: {App}
})

因为组件是用来复用的,且 JS 里对象是引用关系,如果组件中 data 是一个对象,那么这样作用域没有隔离,子组件中的 data 属性值会相互影响,如果组件中 data 选项是一个函数,那么每个实例可以维护一份被返回对象的独立的拷贝,组件实例之间的 data 属性值不会互相影响;而 new Vue 的实例,是不会被复用的,因此不存在引用对象的问题。

感谢各位的阅读!关于“vue组件中data为什么是一个函数”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!


文章名称:vue组件中data为什么是一个函数
文章地址:http://ybzwz.com/article/gocpjh.html