前言
这系列是 React 基础教程（参考 React 官网），记录了自己入门学习 React 的笔记。不太适合有 React 丰富经验的同学，但希望看到此文的你，多少都有些收获。
文章代码均可在我的码云中找到：https://gitee.com/eminoda/react-learn/branches
为了更好的阅读体验，可以在底下的“了解更多”中查看原文（我的语雀知识库）。
事件的绑定
业务代码离不开逻辑的处理，所以第一个就是在 React 中涉及事件的调用。
绑定引用丢失原因
原则上不是 React 造成，这是 js 语言解析的特性。
就好比我们时常会在一个 js 对象方法中，获取到 this 不是指向本对象，而是顶层作用域 windows 一样。
目前还未看过 React 源码，不过大家可以先体会下引用丢失可能的原因：
下面分别示例三种绑定方式。
在构造函数中的绑定
按照 ES6 class 方式，定义一个函数方法 bindInCtor ：
JSX 模板中，通过 this.bindInCtor 来调用触发：
注意，进入方法时，内部的 this 引用 undefined，会出现如下等错误情况：
需要通过 bind 来硬绑定：
public class fields 特性绑定
方法调用还是和之前一样：
不同的是在方法定义的地方使用 ()=>{} 的形式，这方式称为：
public class fields
虽然该特性在 create-react-app 中默认打开，可这是个实验特性。
在 JSX 模板中通过 callback 绑定
区别上述两个，此方式只需在 JSX 增加一个回调函数即可。
并且默认参数是 event，最好不要漏掉。
事件传参
箭头=>方式
显式的添加一个回调绑定方法，定义 event 和业务数据。
因为参数是自定义的，所以顺序可以按照喜好编排。另外，this 绑定不需要再构造器或者 class fields 特性做额外控制。
bind 绑定方式
使用 bind 来强制绑定 this 引用。
绑定方式同样不需要做额外处理，因为没有显式定义 event ，所以 React 会以第二参数默认传入：
native 事件
SyntheticEvent 概要
通常我们需要阻止 a 标签的默认跳转事件，或者是冒泡事件。
React 帮我们封装了这些事件，通过 SyntheticEvent 包装器合成，其实例将被传递到事件处理函数。
所以我们能在 event 看到这些事件：
示例，如何阻止 a 标签跳转：
不要尝试控制 SyntheticEvent
因为 SyntheticEvent 是由 React 合成的，所以不要试图直接在此对象上取某些属性做判断。
可能执行到对应逻辑时，这些属性值就不对了。
支持的事件
摘自官网，供以后查询用：
閱讀更多 前端雨爸 的文章
