条件式容器和选择视图的使用

效果

根据选择的不同会显示不同的操作界面时,我们就可以通过选择视图和条件式容器容器完成。条件式子容器的条件和选择视图选择的内容一致即可显示该子容器下内容。

操作步骤

选择视图的配置

  • step1. 添加选择视图
  • step2. 修改样式
  • step3. 为选择视图添加数据
    选择视图的数据源分为本地/查询,当明确分类时我们可以在本地数据中直接添加选项。
  • step4. 绑定选择视图数据
    点击进入选择视图中,为「选中视图」和「正常视图」绑定数据。当前数据为本地数据中的item,也就是刚添加的选择。
    PS:「选中视图」和「正常视图」绑定的数据是相同的!!

条件式容器的配置

  • step1. 添加条件式容器
  • step2. 修改样式
  • step3. 在「内容」选项卡下,添加条件状况
  • step4. 配置不同条件子容器中的UI
  • step5. 为条件式子容器添加条件
  1. 点击条件式子容器状况名
  2. 点击「内容」选项卡下的「条件」
  3. 在新窗口中进行条件设置
    子容器的状况和选择视图的选项一一对应,因此条件应该为选择视图的选项和值相同。

配置选择视图的默认值
为了在进入小程序时会有一个登入方式,需要为选择视图设置默认值。
默认值输入的内容为选择视图的选项。

操作步骤示范

需要更多帮助

未能解决您的问题?跳转社区进行话题讨论

2022-08-22
3 0