为什么vue里的data要用return返回

jiezi

6 年前

官网的示例

var vm = new Vue({
  el: '#example',
  data: {message: 'Hello'}
});

项目中的写法

data() {
    return {message: 'Hello'}
  }

为什么要把 data 变成函数并 return 属性呢？
组件是一个可复用的实例，当你引用一个组件的时候，组件里的 data 是一个 普通的对象 ，所有用到这个组件的都 引用的同一个 data，就会造成 数据污染 。
将 data 封装成函数后，在实例化组件的时候，我们只是 调用了 data 函数生成的数据副本，避免了数据污染。