React组件里this指向了undefined的原理是什么


这篇文章主要介绍“React组件里this指向了undefined的原理是什么”,在日常操作中,相信很多人在React组件里this指向了undefined的原理是什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”React组件里this指向了undefined的原理是什么”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!在原生js中我们绑定事件的时候是这样子的,绑定的方法点击的时候没有加()这个时候控制台是没有反应的,也就是说,事件没有被触发。当加上()后点击就正常触发执行了,这是js触发事件的规则。在我们写免费云主机域名React的类组件的时候发现了一个问题,问题就是,正常触发事件的时候这个小括号就不用写了,但是如果写了,就算没有点击,也会触发这个事件,因为在react的jsx语法中,从{}开始就相当于js表达式开始了,在js表达式中加了()相当于是调用函数了,不加是当我们点击的时候,让react为我们加上()但是问题接踵而至,我们去掉了小括号,但是此后this的指向变成了undefined,我怀疑可能是我js关于this指向的问题学的不太扎实this指向:普通函数或者作为对象属性,指向window对象事件绑定中指向绑定事件的元素但是需要注意的是,这里我们是在用户点击时,浏览器帮我们将点击事件的this指向绑定该事件的DOM元素。如果通过代码来触发对应的事件的话,我们可以通过call/apply/bind来指定其也就是说当我们通过一个按钮去触发事件的时候,事件中的this指向的是window,所以我们对比着去理解也就明白了为什么React中指向的是undefined,因为React中指向的window,但是我们想让它指向的是当前的类组件的实例,所以babel严格模式下就指向了undefined。构造函数中this指向类的实例。箭头函数中指向的是父级函数的上下文中的this。call,apply,bind指向的是传入的第一个参数。推荐使用 class field的方式到此,关于“React组件里this指向了undefined的原理是什么”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注百云主机网站,小编会继续努力为大家带来更多实用的文章!

相关推荐: Dubbo+zookeeper搭配分布式服务的方法

本文小编为大家详细介绍“Dubbo+zookeeper搭配分布式服务的方法”,内容详细,步骤清晰,细节处理妥当,希望这篇“Dubbo+zookeeper搭配分布式服务的方法”文章能帮助大家解决疑惑免费云主机域名,下面跟着小编的思路慢慢深入,一起来学习新知识吧。…

免责声明:本站发布的图片视频文字,以转载和分享为主,文章观点不代表本站立场,本站不承担相关法律责任;如果涉及侵权请联系邮箱:360163164@qq.com举报,并提供相关证据,经查实将立刻删除涉嫌侵权内容。

(0)
打赏 微信扫一扫 微信扫一扫
上一篇 05/18 21:07
下一篇 05/18 22:52

相关推荐