前端开发：关于Vue组件中的data属性值是函数而不是对象的详解

最近在搞关于前端开发的基础知识归纳，发现了不少经典知识点，那么本篇博文就来分享一个经典的知识点：Vue组件中的data属性值为什么是函数而不是对象。

首先来了解一下Vue组件的使用理念：在Vue组件使用中，组件复用是需要秉承的理念，组件创建好之初就要考虑到后期可复用性，考虑到可复用性，那么就涉及到组件中data数据是要相互独立、互不影响的，不管组件复用多少次，data数据都要被复制一遍，这样当某一处复用的组件数据发生变化的时候，其他地方的复用组件的data数据不受影响。而且由于JS的特性所致的原因，在component中，data属性值必须是以函数的形式存在，而不是对象。

再来看一下在Vue组件中data的属性值是函数，如下所示：

export default {

   data() { // data是一个函数, data: function() {}的简写

     return {

       name: 'sanzhanggui',   // 页面要初始化的数据

         };

     },

};

而不是Vue组件中data的属性值为对象&#