情诗网 >情感文章 > 正文

7-1 Banner轮播图跳转文章详情

来源:情诗网    2021-01-08    分类:情感文章

swiper组件跳转详情页面

跟文章列表跳转一样,先硬编码写一次,轮播图和跳转的文章postId对应好,每个轮播图添加跳转事件。

优化一下,通过事件冒泡来调用。catchtap 阻止继续冒泡。这样如果几十个轮播图,就不用每一个都绑定事件了。

target和currentTarget区别

JS事件,target和currentTarget区别

如果捕获层上有多个节点,那么在单击时,得到的 currentTarget 是设定的捕获层节点,而 target 则是实际被单击的节点,实际被单击的节点通常是位于currentTarget 之内的子节点或是其本身,这就是它们的差别。

1、target发生在事件流的目标阶段,而currentTarget发生在事件流的整个阶段(捕获、目标和冒泡阶段)

2、只有当目标流处于目标阶段的时候才相同

3、而当事件流处于捕获和冒泡阶段时,target指向被点击的对象,而currentTarget指向当前事件活动的对象,通常是事件的祖元素。

bindtap和catchtap区别。bindtap可以继续往上冒泡。比如下面,如果6行上添加一个bindtap事件,事件执行完了之后,会继续往上冒泡,执行4行绑定的事件。但是如果6行上添加一个catchtap事件,就不会往上继续冒泡了。

优化:查看数和收藏数也用模板,收藏数需要服务器,但是查看数利用缓存,变成自己查看的次数。

热门文章