一、动态分类定义
“动态分类”组件可以展示电商、到店、应用数据等信息,与其他组件不同的是,它有多种展示样式可供选择
类型:一级横版、一级大图、一级竖版;二级横版、二级大图、二级竖版
注:web端只做样式预览,未做功能,如果需要查看功能效果,请打包后再查看
二、组件优点
①动态化组件,只需添加少数组件,即可展示大量内容
②小程序上线后,后台可直接修改内容,线上即同步更新(修改内容无需重新打包)
③使用该组件展示的内容,在打包时不会影响到代码包大小
④多种组件样式可供选择
⑤可调用展示:电商、到店、应用数据、门店、多商家等信息
三、动态分类使用教程 1.添加动态分类
(1)进入【编辑页面】-【组件库】-【布局】-【动态分类】,添加动态分类组件
(2)打开模板库,如下图,动态分为分为六大类,分别是:一级横版、一级大图、一级竖版;二级横版、二级大图、二级竖版,选择需要的分类,第一个默认是空白模板
空白模板:是指只有分类,列表没样式的模板
2.一级横版
(1)添加一级横版到编辑器,根据需求选择分类样式、列表样式
(2)动态分类列表设置
在动态分类组件下添加一个自由面板,在自由面板添加图片组件、三个文本组件
(3)选择数据来源(电商/其他数据)
(4)设置分类数据
【分类设置】:指的是绑定数据,此分为两种方式,一种是绑定分类组,一种是自定义分类
【绑定分类组】:针对电商、预约、到店、应用数据等数据来源,后台有对分类进行组管理的,可以直接绑定分类组,绑定某个组之后,则展示该组下的所有分类,以及对应分类下的所有数据
【自定义分类】:根据数据来源(电商、预约、到店),将会展示后台所有的分类数据,可以自动选择所需要的分类,选择了分类之后,将会自动显示该分类下后台绑定的商品数据
(5)对动态分类添加的组件绑定对象
选中组件,开启【绑定对象】,选择对应的字段,如选中图片组件,绑定”商品图片“
选择文本组件,开启【绑定对象】,选择对应的字段,绑定”商品标题“;
依次绑定价格、销量
注:电商、预约、到店、视频等都有固定的字段供选择,不需要自主新增;但是应用数据没有写死的字段供选择,应用数据需要自主创建字段,创建流程:
http://bbs.zhichiwangluo.com/thread-18062-1-1.html
创建完之后,其他绑定流程都是一样的
(6)根据需要可以对列表设置附加组件(包括搜索、排序、定位等)
添加搜索组件:直接添加搜索组件到编辑器,对于电商、预约、到店、视频、门店、多商家等支持对所有的字段进行搜索;如果绑定的是应用数据,则需要自己进行设置根据哪个字段进行搜索
在后台设置应用数据对象的字段时,对该字段开启了必填项、排序项、搜索项,将会根据这个搜索、排序
添加排序组件:添加排序组件到编辑器
需要根据什么进行排序,可以找到对应的排序组件进行设置,如下图:
名称输入为商品标题、选择排序顺序是升序还是倒序,及根据什么字段进行排序
(7)设置列表高度
分为3种:
自定义高度:指的是设置一定的高度,列表数据只能在该高度内滚动
自适应高度:指的是不管数据有多少,根据设置每次加载的数据条数进行加载;其分为点击加载和滚动加载(点击加载:点击某个文案进行加载数据;滚动加载:滚动列表就可以加载数据)
自定义条数:对该列表设置条数,在该列表只展示设置的条数
(8)对分类设置样式
(9)全部设置完了之后,可以查看效果
注:后台添加了多少条数据,则在小程序中将会显示多少条数据
后台添加的商品数据:
3.一级竖版
(1)添加组件到编辑器,支持更换模板
(2)样式设置和在动态分类中添加组件的流程和一级横版是一样的
(3)分类设置,选择数据来源,可以绑定分类组/自定义分类,和一级横版一样
(4)组件样式设置
4.一级大图
(1)添加一级大图到编辑器,支持更换模板
(2)列数设置:指的是每一行显示多少个
上下结构:指的是图标和文字的排版是上下结构
左右结构:指的是图标和文字的排版是左右结构
(3)分类设置,选择数据来源,选中某个数据来源时,后面将会有一个管理,点击【管理】将可以跳转到对应的后台界面去添加数据
(4)组件样式
(5)一级大图绑定数据后,只要选中某个分类,就会跳转到该分类下的数据列表中,默认绑定了,点击大图分类直接跳转到下图列表
5.二级横版
(1)添加二级横版到编辑器,支持更换模板
(2)列表支持自定义列表样式,和一级横版类似
(3)根据需要对二级横板可以添加附加功能,操作和一级横版类似
(4)组件样式设置
6.二级竖版
(1)添加二级竖版到编辑器,支持更换模板
(2)在动态分类上添加组件,制作列表样式的流程和一级横版类似
(3)设置组件样式
(4)效果图:
7.二级大图
(1)添加分类组件到编辑器,支持更换模板
(2)选择数据来源,操作和一级大图类似
(3)设置组件样式
8.收藏为模板
点击【收藏为动态分类模板】,输入模板名称、模板预览图、权重,点击【确定】,将此默认保存,保存后,可到“我的”模板处查看
9.模板管理
模板库的模板仅供使用,自己收藏的模板将会到”我的“模板下,支持对自己收藏的模板进行分类
观看此功能视频教程请点击:http://school.jisuapp.cn/courses/151-18.html
留下评论?
你需要 登录 才能发表评论.