React再学习3_事件

React再学习3

事件的绑定：

方法1：

这是官方推荐的方法，我们在构造函数中定义事件名，然后将其绑定到我们构造的方法。然后再调用的时候就调用构造函数中定义的事件名

方法2：

绕开了方法1比较繁琐的绑定方式，直接在点击事件处进行绑定和使用

方法3：

或者用更简便的箭头函数

 

tab点击事件例子

样式：

 

前面的是比较基础的样式和属性，属性这里，我们有tabs，和currentIndex，currentIndex用来存储当前我们所选中的标签的id

1为我们生成标签的代码，2位生成下面内容的代码。

1，2都是通过map来生成对应的标签。但是2在返回时进行了相应的过滤，只显示我们需要的id的标签的内容。

3是我们点击标签时的时间，传入了我们点击时候的标签id，而在它绑定的事件里面，则更换当前的标签id。

4是我们根据点击的标签id，为他设置不同的布局。

6为为了适配多个标签，我们把width动态设置百分比。

 

事件冒泡

在react中对时间冒泡的操作和原生的差不多，都是通过事件对象event去操作