Vue：为何export default中的data是函数而不是属性

        当你在一个 Vue.js 单文件组件中定义 data 时，通常将其设置为一个函数。这是因为 Vue.js 组件是可以复用的，每个实例都需要一个独立的数据对象，以防止相互之间的数据污染。通过将 data 设置为函数，每次创建新的组件实例时，会调用该函数以返回一个新的数据对象。这确保了每个组件实例都有独立的数据状态，不会相互干扰。

        例如：

<template>
  <div>
    <p>{{ message }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: "Hello, Vue!"
    };
  }
};
</script>

        直接引入 Vue.js 中的 data 是属性： 在引入 Vue.js库本身时，Vue.js 的 data 是一个属性，而不是一个组件的 data。这是因为在整个应用程序中，Vue.js 本身只有一个实例，而不同的组件实例都需要独立的数据状态。所以，Vue.js 的 data 属性是用来管理全局应用状态的，而不是单个组件的状态。

        你可以在全局 Vue 实例上定义一些共享的数据，例如：

new Vue({
  data: {
    globalData: "This is a global data"
  },
  // ...
});

        总之，data 函数用于组件内部的数据状态，而 Vue.js 的全局 data 属性用于管理全局应用状态。这个区别是为了确保组件实例之间的数据隔离和全局状态管理。