在Vue.data已定义的变量，运行时却找不到变量

报错1：Property or method "xxx" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: 属性或方法“xxxx”未在实例上定义，但在渲染过程中被引用。通过初始化该属性，确保该属性在数据选项中或在基于类的组件中是反应性的。通过初始化属性，可以在data选项中，也可以在基于类的组件中。

报错2：The "data" option should be a function that returns a per-instance value in component definitions.

可以先查看查看官方文档vue2：https://v2.vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties

问题:没有其他拼写错误，但是已经定义的变量还是在控制台中显示没有定义，个人判断如果当前文件是在组件 (component) 里，data 必须声明为有返回一个初始数据对象的函数

解决方法：将data的定义和其他方法塞到    export default中，data中的变量定义方法要修改一下加一个function

修改前代码：

修改后