一、预览效果

二、实现逻辑

使用选项卡组件，图片组件和轮播图片组件共同实现通过点击小图控制大图轮播。

三、操作步骤

分别添加选项卡、轮播图片视频、图片组件以及数据容器。

step 1.添加一个数据容器，并在数据容器中添加所需图片的链接。

本文数据容器中的数据如图所示

step 2.选中轮播图片视频组件，取消【开启轮播】。

step 3.在【轮播图片视频】-->【数据】中，关联第一步中添加好的数据容器，并添加数据过滤器。

过滤器中的代码如上图所示

step 4.分别将图片1、图片2、图片3、图片4关联第一步中添加的数据容器，并开启数据过滤器，使图片组件分别与数据过滤器中的四张图片绑定。此处以图片1为例。

图片1数据过滤器中的代码如图所示

step 5.给【选项卡】组件添加四个自定义事件，事件类型选择【状态改变】，条件分别设置为s=1/2/3/4，匹配动作为【轮播图片视频】-->【设置当前项】，并设置相应参数。

如需教程Demo，请关注公众号【易知微产品帮助中心】，发送“首图轮播”即可获得~