Zion无代码,数据的读取和显示,无代码怎么调用后端api?
阅读本篇前,建议先熟悉《基本操作》,点击链接访问
https://www.yuque.com/functorz_doc/study_path/vmu0vapgqfiu5opu?singleDoc#
数据的读取
数据存在哪里?
在互联网上看到的那些文字、图片、视频、地图等其实都是我们所说的数据。
Tips:
常见的数据类型文本、整数、日期、时间、文件、地理位置、图片、视频等。
在 Zion 中数据可以存在【本地】也可以存在【远程】数据库中。
本地
以下方式是将数据存在【本地】:
- 直接在输入框中输入的文字
- 直接上传的图片
远程
被存在【远程】数据库中的数据,读取后可以绑定到对应组件上进行显示。
向【远程】数据库中存储数据需要【数据表】,【数据表】可以在【数据模型】中进行创建。
Tips:
【数据表】的新建和更新需要预览才能生成。
之后就能向【远程】数据库中上传你需要存储的数据。
Tips:
如何辨别数据需要存在哪儿?
【本地】用于存储【静态数据】,就是通常不需要发生变化的数据。
例如:按钮的提示文字、页面背景图片、页面标题、LOGO
【远程】用于存储【动态数据】,时常发生变化的数据。
例如:多张商品详情图、商品详情、商品价格
如何读取【远程】数据库中的数据
在Zion中,可以读取到【远程】数据的方式有
- 页面的【远程数据】
【远程数据】可以获取单条数据,也可以获取多条数据。
- 单条数据
当将【限额】等于1时,就只向【远程】数据库中读取单条数据。
- 多条数据
当将【限额】关闭后,每次请求可以读取多条符合条件的数据。
- 列表类组件
列表、选择视图、横向列表、数据选择输入框 这四个组件是 Zion 中的列表类组件,它们可以用来获取多条数据。
Tips:
这当中提到的多条数据,实际上就是我们常说的数组。
如何读取指定的数据
大部分时候,我们并不需要【数据表】中的全部数据,而是会筛选出一些数据进行显示。
这里的常见方式有:过滤、去重、排序。
举个例子:
在excel表中存放了「口红」、「粉底」、「眼影」、「腮红」四个分类的美妆分类,当前只需要显示「口红」类的商品。需要以「分类」等于「口红」作为过滤条件,就会读取所有分类是「口红」的数据。
在 Zion 中想读取指定的数据也需要进行过滤操作,通过添加【过滤条件】来得到指定的数据。
过滤有很多方式,具体可以参考【过滤专讲】
数据读取失败的常见情况
- 过滤条件设置错误
详见【过滤专讲】(后期更新)
- 数据模型没有生成
修改数据模型后,没有更新【远程】数据库,导致【远程】数据库中的【数据表】未生成对应的数据存储字段,会导致绑定失败。
- 算力溢出(50个dau)
不同项目所提供的算力不同,以免费版为例免费项目每秒请求数约为5,当超过这个请求数后,数据读取将会排队。当你项目的活跃用户数量增多时,为了保证正常运行即时购买更高级的版本。
- 网络延迟
当网络环境不好,出现网络延迟现象,会出现请求数据需要经过很长时间才能返回或者请求失败的情况。
数据的显示
不用担心!不管用什么显示方式,都不会改变数据源
如何让组件显示对应数据
需要呈现的数据类型不同,就需要由不同的组件来进行显示。
例如:文字类数据,绑定到【文字】组件;图片类数据,则绑定到【图片】组件;
不匹配的数据类型将无法进行绑定。
Tips:
- 【本地数据】和【远程数据】操作区别。
【本地数据】可以直接在 Zion 编辑器的右边属性栏中进行数据输入
【远程数据】数据存在【后台】数据库中,在 Zion 编辑器中需通过点击【+】引用对应的数据。
本地
【本地】数据在右侧属性栏中输入后在 Zion 编辑器中可以直接显示。
但【列表类组件】在绑定本地数据时,依然会显示为【item】。
远程
【数据库数据】可以获取单条数据,也可以获取多条数据。
- 单条数据
当只获取单条记录时,可以显示这条记录里所有记录内容
- 多条数据
当将【限额】关闭后,每次请求可以读取多条符合条件的数据。
这时由于存在多条数据,无法得知具体要显示哪条数据中的什么内容,因此只能显示获取到数据的聚合数据(count、max、min、sum、avg)。
Tips:
【远程数据】获取的数据可以绑定在任意当前页面的任意图层的组件中。
当你需要获取多条数据,又想显示每条数据中的详细内容时,就需要使用列表类组件。
- 列表类组件
当需要获取多条数据,并让这些数据都以相同的样式进行呈现。
Tips:
列表类组件获取的数据,只能在该组件内部的各图层中进行使用。
【列表项数据】就是取出多条数据中的一条,index代表它的的排序,从0开始计算。
本地+远程
存储在本地的数据和远程读取的数据可以搭配使用。
举个例子:
在界面上显示商品的价格,显示格式为【价格:xxx】
【价格:】是固定的数据(静态数据),【xxx】是不同商品的价格(动态数据)
特殊例子:
当列表绑定的数据表在【远程】数据库中还没添加数据,并在列表容器中添加了一些静态数据,这时进行预览,列表将不会显示任何数据。因为这时列表并没有读取到任何数据也就无法显示。
例如:列表组件要展示美妆商品,在列表容器中添加了【名称】、【价格】这些文字,但是在【远程】数据库中还未添加数据记录。这是点击【预览】就看不到任何数据。
Tips:
- 【本地数据】和【远程数据】显示区别。
【本地数据】绑定后,在 Zion 编辑器中可以直接显示。
【远程数据】绑定后,在 Zion 编辑器中媒体数据(图片、视频、文件))不会直接显示对应内容;非媒体类型数据显示的为对应数据名称。
数据样式调整
右边属性栏
选中组件后可在右边属性栏的【样式】选项卡下,调整数据的显示样式。
例如:文字的大小粗细、图片的裁切方式。
数据格式调整
以下数据在选择之后可以进行【格式】的选择:
- 日期
- 当前日期时间(时间戳)
- 当前日期
- 时间
- 地理距离