更多实用小demo,迈向独立程序员的起点 | 【uni-app】【uniCloud】实战系列 | 猿创营

1,313 阅读5分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第3天,点击查看活动详情

前言

本文主要记录了我在学习 uni-appuniClound 实战课程 的过程
并记录下实现代码过程中的遇到的问题、以及对应的解决方法,也记录下我对此的思考总结
具体的课程是 大帅老师的 付费课程
目前我已经学完,确实非常的不错
此项目集合已经发布到了线上,大家可以搜索小程序 鱼爸爸 体验一下
小程序刚上线,主要是把学习东西体现出来;
可能存在很多bug,大家可以反馈给我,谢谢!

系列文章

第一篇:《一个简易的绘画板功能?别小看它,知识点可不少!| 【uni-app】【uniCloud】实战系列 | 猿创营

第二篇:《github 中国区大佬排名都有谁?每天凌晨1点定时更新给你看 | 【uni-app】【uniCloud】实战系列 | 猿创营》

第三篇:《更多实用小demo,迈向独立程序员的起点 | 【uni-app】【uniCloud】实战系列 | 猿创营》

前置知识点

前置说明

本篇文章主要把剩余的几个小 demo 放在一起,逐个给大家介绍下

因为下面几个demo,代码量不是很多,知识点比较散,更多的在于熟悉 微信小程序 生态里面 规则和功能

只要是开发小程序,我相信这些demo里面的功能涉及的点肯定是迈过去的知识点

下面就赶紧熟悉一下吧

线上小程序体验

鱼爸爸-小程序.jpg

demo1-每日签到

先看效果

签到.gif

功能说明

签到功能,我相信大家都肯定很熟悉。基本很多场景都会用到!

此处的签到功能做的比较简单

进入签到页面,首先获取该用户的所有签到日期,根据已经签到的日期来展示不同的UI

点击签到,云函数的接口里面只要查询 从当天的 0 点开始往后是否有 签到记录 即可

如果有签到记录,说明已经签到了,如果没有数据库记录,那么就添加一条记录

以上便是所有的功能

当然在实际运用场景中,其实主要是 签到 和 积分挂钩(比如连续签到多少天,就获得奖品或者获得多少积分)

重点体现在 这一块的逻辑算法上

demo2-微信步数

先看效果

微信步数.gif

功能说明

点击进入微信步数的页面,会先申请获取得到你的 微信步数的授权

获得授权后,就可以获取到之前30天的数据

功能不算难,主要是要熟悉一下 微信小程序生态里面的玩法,包括 解密数据等

在现实场景中,基于微信步数的玩法也很多

就看具体的业务场景了

完整步骤

  • 微信登录接口,获取 openid
  • 获取微信步数的授权
  • 获得 微信步数的数据,并解析数据(数据加密了)

image.png

// 1. 微信登录接口
wx.login()
// 2.获取授权
wx.getWeRunData()
// 3.解析数据
具体代码此处就不展示了...

demo3-海报分享

先看效果

海报分享-完整.gif

功能说明

小程序分享一直是比较克制的

在实际的业务场景中我们经常要让用户将对应的页面分享给好友,从而获得 对应的激励

所以生成带有参数的小程序二维码就很有必要

二维码里面带有分享者的 信息 和 分享的页面,或者你想要的其他信息

这样就可以实现推广的作用

重点是要熟悉小程序对应的相关的 API

相关API

  • 获取小程序二维码

    生成小程序码的API有好几个,但是都有相应的优缺点,比如有的 有次数的限制,最终我们选择 wxacode.getUnlimited 这个接口

  • 分享参数的注意事项

    小程序码带的参数会有字符限制 32 个字符

    所以实际使用的时候 我们 id 、页面路径 一般都很长

    那么这个时候,我们自己做个映射即可;或者其他的办法

demo4-订阅消息

先看效果

订阅消息.gif

功能说明

这个场景肯定会用到,就是消息通知

比如说你买了东西,然后 发货了,那么我们就发一个小程序消息给用户告诉他一下

或者说有很多的抽奖小程序,几乎每个小程序都会用到

当然需要提前在小程序后台设置 相关模板

image.png

注意事项

  • 订阅消息

    订阅消息需要用户有主动的动作才行,否则不能主动发起

    用户只有在点击同意的情况下,后面下发 消息,该用户才能看收得到

    其实,我以前做过线上项目,我是用 公众号发送通知给用户,用户点击后进去小程序的

    因为公众号发送消息,用户肯定能收到,不需要用户主动同意【当前前提是已经关注了公众号】

    对应API:wx.requestSubscribeMessage

  • 消息通知

    下发消息的时候,云函数只需要,调用 腾讯的对用接口,模板ID,以及参数设置好,调用即可

    文档地址:传送门

总结

本篇文章集合了好几个小demo,虽然都很简单

但是如果不是很熟悉 小程序的生态,估计也是够折腾的

特别是里面的 解密数据服务端接口调用的一些接口

希望本篇文章对您有帮助!

最后推荐下大帅老师,确实很厉害,干货多多;

公众号里搜 大帅老猿,在他这里可以学到很多东西