本文介绍了如何使用无代码开发工具Zion在20分钟内创建一个电商小程序的SKU分类页面。首先，阐述了制作思路，包括项目拆解、数据模型构建和用户交互设计。接着详细讲解了制作过程，从低保真设计开始，搭建数据模型，设定组件关系，并实现了选择视图、列表组件、商品详情页的交互功能。最后，讨论了数据传输和页面跳转的实现，确保用户点击商品条目时能准确跳转到对应商品详情页。
如果要做一个电商小程序，其实很重要的一步是商品分类，一方面用户使用的过程中可以快速检索，另一方面商品如果有清晰的标签，也方便我们后台管理数据。今天来说一下我怎么用无代码开发20分钟搭建sku分类页面，先来看一下制作效：
制作思路
1、一个项目就是一个个小场景的组合
2、数据模型的搭建（思考过程：商品有自己的类别，也有自己的详细信息）类别有自己的一张表，商品也有自己的一张表分别记录自己的信息
3、点击相应的类别时会显示对应类别的商品
4、点击商品的条目显示商品的详细信息
制作过程及思考过程
因为是自己做一个小场景所以不用着急先去构思数据模型而是通过拖拽来自己做一个低保真设计图。
这里选用了选择视图（因为要选择商品列别）、列表（展示商品条目）、图片（展示商品）、文字（显示商品详细信息）
第一步：低保真出了之后就是数据模型的搭建
第二步：数据模型之间的关系
思考：因为一个类别中有多个商品所以分类和商品是1:n关系
最低0.47元/天 解锁文章
扫一扫
355
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
