🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
>[success] # data 属性 1. 在Vue2.x的时候,也可以传入一个对象 2. 在Vue3.x的时候,必须传入一个函数,否则就会直接在浏览器中报错 ~~~ const app = Vue.createApp({ data: function() { // 必须是函数 return { counter: 0 } }, methods: { increment: function() { this.counter++ }, decrement: function() { this.counter-- } } }) ~~~ >[success] # 声明式(选项式) method 1. `methods` 中的this 指向式`data`中返回的对象的属性 2. `methods` 中不能使用箭头函数来定义,箭头函数绑定是其父级作用域上下文(即在当前来说是`window`),此时`this` 就将不会按照期待指向为 `vue 实例this` ,当使用`this.data中的属性`时候 为`undefined` * vue3 methos 中this 指向源码 ![](https://img.kancloud.cn/86/27/8627129b02bc7366e76562cebae660e6_1239x631.png) * vue 2 中 methos 中this 指向源码 ![](https://img.kancloud.cn/d3/5f/d35fb2d755945eb571fa9af9f5565df6_1001x286.png) ![](https://img.kancloud.cn/dc/d9/dcd98535e38c05a811d09140ed4214d1_581x78.png)