【功能演示】列表组件通过数据生成多个相同样式的组件
2025-04-30 16:50

山海鲸可视化软件中,列表组件通常是作为一个容器来使用(类似文件夹),所以列表内部为空的时候无法使用,一般都需要在其内部添加一些其他的组件,通常用来展示文字、图片、视频等媒体组件,也可以通过数据生成多个相同样式的组件


下面是简单的图文教程,也可以点击链接查看详细的视频教程:山海鲸列表组件通过数据生成多个相同样式的组件


在山海鲸可视化中创建并打开一个空白项目,在组件库中查找并添加列表组件。


我们选中列表组件,然后在数据中删除绑定的分组字段


接着在列表组件中分别添加一个基础多行文本、基础单行文本组件和图片组件,并调整它们的大小和位置。


然后我们需要使用数据来填充组件的内容,并且生成多个相同样式的组件,点击左上角的“数据-添加数据”


添加示例数据,这里使用Excel文件进行演示,该Excel文件包含标题、简介图片链接三个字段,分别对应基础单行文本、基础多行文本图片组件,并且每个字段都有三条数据。


在看板图层中点击选图片组件,在样式中为图片地址生成数据字段


生成数据字段后我们就可以给图片组件绑定数据,将图片链接数据绑定到数据字段中,此时列表中就会展示第一个大屏的图片。


基础单行文本基础多行文本组件也是相同的操作,为文本生成数据字段然后绑定数据即可,具体步骤可在视频教程中查看,设置完成后效果如下:


不过现在列表组件只显示第一组的文本、图片数据,无法显示第二、三组的数据。我们点击切换到数据栏目,需要为分组字段绑定数据,这里将标题数据绑定到分组字段中。


重新加载一下列表组件,此时列表中就会生成三组相同样式的组件,并且会轮播展示不同的内容。

独角鲸 独角鲸

登录一下,更多精彩内容等你发现,贡献精彩回答,参与评论互动

登录! 还没有账号?去注册

评论0

暂无评论

咨询热线0571-88650917
地址 公司 邮箱

杭州市文一西路海创科技中心 311121

杭州多算科技有限公司

support@shanhaibi.com

关注山海鯨官方qq群,了解更多内容

QQ群号:788095444

Copyright © 2020-2025 多算科技, All Rights Reserved. 浙ICP备20006837号-5