vue let that = this的问题

于 2024-05-08 16:41:41 发布
阅读量230 收藏
点赞数 2
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/axinxina/article/details/138576674
版权

vue let that = this的问题


在改别人项目的时候，看见代码里总是有let that = this 或者是 let _= this，很好奇为什么要这么写？原来是因为作用域的问题。

请添加图片描述

第一个console.log打印出来的this指向vue实例，并且能获取data里面的arr，第二个setTimeout打印出来的this指向window，因为没调用者指向全局，且不能获取vue里面data的arr
请添加图片描述
如果想要在settimeout里获取到vue里面data的值
第一：使用let that = this，意思就是，将当前的this赋值给that 这样 settimeout里面的this就是外层函数this
请添加图片描述
请添加图片描述
第二：使用箭头函数，箭头函数的this指向上一级作用域或父级作用域
请添加图片描述
请添加图片描述
欢迎大家指出问题~~~

Pitiless ^
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
浅谈VUE监听窗口变化事件的问题
11-26
Vue提供了多种方式来解决这个问题，让我们一步步探讨如何在Vue 2.x和ES6环境中实现窗口尺寸变化的监听和响应。 首先，我们需要在组件的数据对象(`data`)中定义一个属性来存储窗口的宽度。例如： ```javascript ...
记录vue做微信自定义分享的一些问题
10-16
let that = this; let url = window.location.href; let { data: wxCfg } = await that.ajax({ api: that.api.wechatGetWxSdk, data: { url } }); if (!wx || !wxCfg) return; wx.config({ debug: false, ...
let that = this 或者 var that = this 有什么意义
boyikenan123的博客
04-06 1060
在vue 开发过程中我们经常会发现 let that = this 这样写有什么好处呢 首先要理解this,下面简述两点 this 永远指向一个对象 this 的指向取决于函数调用的位置 首先 this 指向的是一个对象，这个好理解，难就难在第二点，在JavaScript 中 一切都是对象，运行环境也是对象，this 的指向是动态的很难确定指向那个对象 $('#conten').click(function(){ //this是被点击的#conten var that =thi
vue中let that=this的作用及说明
OKMZY的专栏
06-21 885
这里声明一个变量指向父函数的this, 用于 _this.DataNow = new Date();修改父函数的“DataNow”实现动态时间，如果这里改为this.DataNow = new Date() 就指向了mounted里面的DataNow 则没有了效果；_this只是一个变量名，this代表父函数，如果在子函数还用this，this的指向就变成子函数了，_this就是用来存储指向的。2.vue.js的this作用域问题。
vue中let that=this的作用
晚风的博客
03-19 3405
this 会随着上下文环境而变换它的指向，在当前作用域中设置一个变量用来存储 this 可以防止在其他地方找不到 this 的错误。 ```javascript $("#btn").click(function(){ var that = this;//这里this和that都代表了"#btn"这个对象 $(".tr").each(function(){ this;//在这里this代表的是每个遍历到的".tr"对象 that;//仍代表"#btn"
let that=this；vue保存this的指向，嵌套函数的this指向为window
m0_45260754的博客
04-26 992
export default { name: 'HelloWorld', data () { return { msg:"原始值", } }, methods:{ testClick:function(){ let that=this;//this指vue实例 that.msg="修改后的值"; that.$nextTick(function(){ console.log(that.$refs..
vue js 回调函数 异步处理 为什么要 let that = this
最新发布
tenc1239的博客
08-23 1276
4 回调函数 用that = this ->回调函数的作用是允许我们在一个函数中处理一些异步或耗时的操作，而不需要等待它们完成。的this的值.而在主线程处理的时候,this的一直在变化, that的值保留在那一刻。),用that 值 做处理,然后返回处理结果,而that的值是开启。4.1 把函数或方法作为 参数传递 funcA ->被称为高阶函数。2 异步 但是没有在异步处理函数中 不用that = this。3 异步在异步处理函数中 用that = this。1 异步就是开个事务(
在vue中使用回调函数,this调用无效的解决
10-14
在Vue.js应用中，开发者经常会遇到`this`指向问题，特别是在使用回调函数时。这个问题通常发生在异步操作中，如网络请求，因为这些操作会在不同的上下文中执行，导致`this`不再指向Vue实例。以下是对这个问题的深入...
vue 监听屏幕高度的实例
12-12
let that = this; setTimeout(function () { // 计时器延迟执行，重置timer标志 that.timer = false; }, 400); } } } ``` 这样，当`fullHeight`改变时，只有在上一次事件处理完成且400毫秒内没有新的`...
Vue结合JFinal调用activiti工作流
06-19
作为没用过工作流的一员，之前看过vue引入activiti工作流的案例，但是组件中存在很多问题，这个是我修改过并且成功调用，大家可以供参考，富含Java代码（Jfinal），后续出spring版本的， 前台版本vue4.0版本， ...
【面试点】：vue中关于this的详解
jieweiwujie的博客
09-25 1449
<template> <div class="home"> 1.window的匿名函数 如settimeout（没有箭头）指向是window；函数里面调用要用that变量接一下，才能拿到vue实例，不然指向window 2.js函数 如foreach ，filter（没有箭头）没有指向，所有函数里面调用，直接指向vue，不用做变量替换 3.箭头函数，没有具体的this指向，在它内部使用，由宿主对象决定 3.1匿名函数使用箭头函数写，指向方法的.
为什么vue要使用 let that = this
football98的专栏
02-20 5111
在Vue中this始终指向Vue，但一些其他组件如axios中this为undefined 通过： let that = this 将this保存在that中，再在函数中使用that均可 。
that=this写法的意义 整理 （如调用接口中this失效（undefined））
AmbroseLe
03-24 974
1、在Vue中this始终指向Vue，但一些其他组件如axios中this为undefined 通过： let that = this 将this保存在that中，再在函数中使用that均可 。 2、为什么栈空间满了。但换成var that=this，使用that时就不再报栈空间满的错误。 如果在子函数还用this，this的指向就变成子函数了，that就...
Vue中 let _this = this的作用
热门推荐
qq_42750329的博客
07-29 2万+
在查看别人所写的代码时，通常都会看到这样的写法：let _this = this，一开始并不明白其用意，经过查阅发现其目的是为了存储this的指向。可以通过观察下面的例子来加深理解。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>组件测试</titl...
为什么let this=that
曲小强
10-09 7972
不知道大家有没有接触过jquery jquery里边有一个特别典型的例子能说明用_this的作用 $("#btn").click(function(){ var that = this;//这里this和that都代表了"#btn"这个对象 $(".tr").each(function(){ this;//在这里this代表的是每个遍历到的".tr"对象 ...
js中的_this
起风了
04-24 660
问题一:不知道楼主有没有接触过jquery jquery里边有一个特别典型的例子能说明用_this的作用$("#btn").click(function(){ var _this = this;//这里this和_this都代表了"#btn"这个对象 $(".tr").each(function(){ this;//在这里this代表的是每个遍历到的".tr"对象 ...
let that = this 重要性
缚己
03-14 1054
阅读其他人代码的时候，可能会遇到这样一段代码 let that = this 不要小看这段话，作用大了去了。 原因是：this 会随着上下文环境而变换它的指向，在当前作用域中设置一个变量用来存储 this 可以防止在其他地方找不到 this 的错误。 ...
解释Vue代码： onLoad() { let that = this //页面加载就获取相关信息 this.getData(that) },
04-16
这是一个使用Vue框架编写的前端...函数内定义了一个变量that，用于保存当前页面的this指针，以便在内部函数中调用。接下来调用了一个名为getData()的函数，传入that作为参数，实现了在页面加载时获取相关信息的功能。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值