一、预览效果

二、实现逻辑

 通过【轮播表格】组件添加URL数据并发出回调参数，【iframe】组件接收参数后弹出网页，同时配合【文字】组件和【自定义事件】，实现点击表格弹出对应网页的效果。  

三、操作步骤

点击【组件】→【文字】→添加【轮播表格】到工作台。

选择【轮播表格】组件→【数据】→添加【url】链接。

（ps：添加url链接，格式如下，网页链接替换加深部分即可）

（注意：前面false需要添加英文","  否则会报错；url链接中间是“：”而不是“=”）

"url":"网页链接"

这边有三行示例数据，所以有三段代码后面都需要添加链接，根据需要添加即可，如下图所示。

接下来我们添加交互的部分，为【轮播表格】添加回调参数

【交互】→【回调参数】→添加回调【+】→匹配动作【点击行内容】→字段值设置为【url】→变量名设置为【url】。

（ps：【字段值】是刚刚设置的url链接，【变量名】理论上可随意设置，这里为了方便仍然设置为url）

点击【组件】→【辅助】→添加【iframe】组件。

选中刚刚创建的【iframe】组件→点击【数据】→点击【+】→添加【数据过滤器】。

点击【新建过滤器】→输入过滤器代码（如下）→【保存】→点击【添加回调】→回调字段设置为：url→设置【开启过滤器】。

【过滤器】代码如下所示：

const {url} = callbackArgs
return [{  url,}];

添加文字组件【标题】，该标题的作用是：当点击该文字时，关闭弹窗。

点击【组件】→【文字】→添加【标题】组件。

选中【标题】组件→【数据】→文本内容修改为‘关闭’。

接下来需要调整一下【关闭】的位置，由于【iframe】开启了过滤器，所以现在是看不到的，我们需要把鼠标的【光标】悬浮在组件上，才能看到轮廓。调整文字组件位置，将【关闭】置于【iframe】右上角。

点击左侧【标题】→按住键盘的【shift】键→再点击左侧【iframe】→确保都选中（蓝色亮起）→右键点击【成组】，将两个组件绑定在一起。

成组后会有文件夹标识并且名称为【分组】，点击【分组】→右键【重命名】→修改名称为【弹窗】，再到右侧勾选【默认隐藏】。

点击左侧【轮播表格】组件→【交互】→【自定义事件】→点击【+】添加一个自定义事件→事件类型设置为【鼠标点击】→组件设置为当前的【弹窗】分组→动作设置为【显示】。

点击左侧【标题】组件→【交互】→【自定义事件】→点击【+】添加一个自定义事件→事件类型设置为【鼠标点击】→组件设置为当前的【弹窗】分组→动作设置为【隐藏】。

（ps：因为组件被隐藏或覆盖等原因，无法在工作台上直接选中组件，所以在左侧点击可以快速选中组件）