vue中this和that区别

刚开始看别人的代码时,不明白为什么要有这一步,感觉像是多余的,但是后来自己开发页面的时候,发现不少这样的。

在这里插入图片描述
当我的函数如下时,
在这里插入图片描述

在这里插入图片描述
当我运行时,会报出如上错误:getApplication函数未定义,但是此函数是从全局状态管理中引用过来的,没有什么问题。
在网上百度了之后,将函数改成如下:
在这里插入图片描述
可正常运行,当没有换成that之前,也就是使用this时,此时系统会认为getApplication是onClose中的一个匿名函数对象,但是onClose中是没有此函数的。故会报错。若我们提前将this保存在that中,他就可以正常寻找到getApplication函数。

  • 4
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
根据提供的引用内容,当我们在Vue 2使用`that`时,通常是在组件内部的某些方法使用。`that`是一个常见的命名约定,用于引用组件实例。在Vue组件,我们可以通过`this`关键字来访问组件实例,但在某些情况下,由于作用域的限制,我们可能需要将`this`赋值给`that`变量,以便在嵌套函数或回调函数访问组件实例。 例如,在一个Vue组件的方法,我们可以使用`that`来引用组件实例,如下所示: ``` export default { data() { return { message: 'Hello Vue!' } }, methods: { showMessage() { const that = this; setTimeout(function() { console.log(that.message); }, 1000); } } } ``` 在上面的例子,我们在`showMessage`方法创建了一个定时器,并在定时器的回调函数使用`that`来引用组件实例。这是因为在回调函数,`this`的作用域已经改变,不再指向组件实例,所以我们需要使用`that`来访问组件实例的数据。 总结起来,当我们在Vue 2使用`that`时,通常是为了在组件内部的某些方法访问组件实例。 #### 引用[.reference_title] - *1* *2* [Vue学习笔记(一)—— 什么时候需要import Vue from 'vue'](https://blog.csdn.net/weixin_43503511/article/details/103547574)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [vue2转vue3方案](https://blog.csdn.net/YoungtiNine/article/details/124495867)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值