培训报名小程序-我的功能

简介: 培训报名小程序-我的功能


我们的培训报名小程序的完整业务功能已经开发好,通常小程序还提供我的功能,主要是用来查询自己历史的提交记录。我的功能开发我们使用区块模板来制作。

1 区块模板

区块模板是一个功能块,可以进行快速复用。首先添加一个我的页面

页面创建好之后往页面添加一个个人中心区块

因为我们这个小程序我的功能比较简单,只需查看自己的历史提交记录,我们只保留微信用户这一块,其余的都删掉,并调整图文的内容


然后修改tab栏组件,将导航条调整为首页、我的两个菜单

2 报名情况

从我的页面,按照这三个图标点进去打开报名情况页面,以页签的形式区分不同状态下的数据。我们先创建一个报名情况的页面


往页面拖入顶部选项卡组件

修改标签列表,改为全部、待支付、已支付

然后往第一个内容插槽里放入数据列表组件,数据源选择我们的报名信息

文本我们绑定为培训课程的标题字段

去掉我们的图标组件,添加一个文本组件,并且绑定我们的支付状态字段

$w.item_listView1.zfzt=='1'?'待支付':$w.item_listView1.zfzt=='2'?'已支付':''

这里我们用三元表达式重新对显示内容做了一下格式化,状态为1的显示为待支付,状态为2的显示为已支付,如果都不是的我们显示为空

第二个内容插槽我们将第一个内容插槽的数据列表复制一下放到第二个里


添加一个数据筛选条件,让我们的支付状态等于待支付,按照同样的方法设置第三个内容插槽,条件是支付状态等于已支付

3 页面传参

内容插槽设置好之后,我们还需要从我的页面点击对应的状态让顶部的页签默认选中,我们需要设置一个URL参数

将这个参数绑定到我们的顶部选项卡的选中标签中

回到我的页面,给图标绑定点击事件,打开页面,传参的话全部我们传0,待支付传1,已支付传2

4 最终效果

5 课程总结

我们本次实战课带着大家实现了一个培训报名的小程序,在首页我们实现了培训课程按分类展示,点击某个分类可以看到课程,点击报名填写基本信息可以跳转到支付。之后提供了我的页面供用户查询自己已经报名的数据。


整体上不是太复杂,适合刚学习微搭的同学练习。主要需要掌握数据模型的建立,页面布局及组件的搭建,以及各种事件的设置。


有人说托拉拽不是编程,姑且听之任之,算不算编程不重要,能用工具做出自己需要的软件最重要,有需要的同学照着教程练习一下吧,眼睛看会不算会,做出来可以使用才行。

相关文章
|
5天前
|
小程序
微信小程序如何实现进入小程序自动连WiFi功能
微信小程序如何实现进入小程序自动连WiFi功能
|
5天前
|
小程序 API
点餐小程序实战教程09-订单功能开发
点餐小程序实战教程09-订单功能开发
|
5天前
|
小程序 开发工具 数据库
零基础开发小程序第三课-列表功能开发
零基础开发小程序第三课-列表功能开发
|
5天前
|
小程序 JavaScript
微信小程序图片预览功能?
微信小程序图片预览功能?
|
5天前
|
小程序 JavaScript Android开发
【经验分享】如何在支付宝小程序里玩转富文本功能
【经验分享】如何在支付宝小程序里玩转富文本功能
93 0
|
5天前
|
编解码 小程序 IDE
【产品上新】小程序相机功能全面开放!
【产品上新】小程序相机功能全面开放!
58 0
|
5天前
|
移动开发 小程序 安全
【社区每周】小程序基础2.7.23版本上线;卡证识别功能全面公测(2022年8月第二期)
【社区每周】小程序基础2.7.23版本上线;卡证识别功能全面公测(2022年8月第二期)
35 0
|
5天前
|
存储 小程序 开发工具
零基础开发小程序第四课-查看功能开发
零基础开发小程序第四课-查看功能开发
|
5天前
|
小程序
微信小程序用户登陆和获取用户信息功能实现
微信小程序用户登陆和获取用户信息功能实现
14 0
|
5天前
|
前端开发 小程序
【微信小程序5】利用canvas实现纯色背景抠图功能
【微信小程序5】利用canvas实现纯色背景抠图功能
35 0

热门文章

最新文章