浏览器无法直接识别jsx语法,执行jsx时被babel解析转译,而babel解析过的js代码会默认转化为严格模式。严格模式下最外层的函数默认调用本指向window的this会变成undefind
简单大致的解释一 点击事件的运行过程
上面的可能有点抽象 这里用js再解释一下
所以这里推荐两种解决方法
1.就是直接绑定this
2.就是嵌套在箭头函数中(最常用)
解析一下,Dom元素的点击事件触发执行箭头函数箭头函数的指向为这个组件的实例对象箭头函数又调用了我们需要的函数 普通函数就是谁先用this就指向谁这时候函数的this也指向了这个组件的实例对象