备忘录小程序开发(微信小程序)

最近面试需求写一个备忘录,功能有增删改查,备忘录提醒。技术栈:使用微信小程序原生+云开发。ui:vantweapp
在这里插入图片描述
在这里插入图片描述

1.项目构建

在开发前需要准备一个邮箱,首先注册一个微信小程序,然后用注册的账号绑定微信,扫码登录微信开发者工具

1.1导入项目

打开链接复制或下载项目:https://gitee.com/invctus/memo_demo.git

使用创建好的小程序appid,注:需要把小程序的东西填好才能用。
把小程序信息和小程序类目填好,例如备忘录
在这里插入图片描述
在这里插入图片描述
选用模版
在这里插入图片描述
在这里插入图片描述
按顺序选择
在这里插入图片描述
在这里插入图片描述
创建成功后参看模版详情复制模版ID
修改mini/envList.js中的templateId为模版ID

...
const templateId = 'VxCZ5YrXVzts3yucm***y9k8At5VblAQ'//订阅消息模版id
...

修改云开发sendMsg云函数中的templateId
在这里插入图片描述

1.2开通云开发

左上角点击云开发,开通后如下 。

在这里插入图片描述
复制到mini/envList.js中修改环境id和别名

const envList = [{"envId":"memo-4gw3w****6dbe284d4","alias":"memo"}]//云开发环境id

1.3 创建并构建云函数

“请在cloudfunctions文件夹中memo_cloud上右键,创建部署云端安装依赖,然后再次体验”

“请在cloudfunctions文件夹中sendMsg上右键,创建部署云端安装依赖,然后再次右键上传定时触发器”

在这里插入图片描述
上传成功后云函数是绿色的,并且进入云开发后台也能看到
在这里插入图片描述

1.4数据库集合操作

1.4.1创建数据库

在这里插入图片描述

1.4.2 设置数据库权限

在这里插入图片描述

1.4.3 根据需求设置索引

在这里插入图片描述

1.4.4开通云存储

在这里插入图片描述
在这里插入图片描述
到此项目应该是可以运行了。

  • 5
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
小程序备忘录开发源码,微信的react的特性使它很适合用来开发这种单机版简单交互的备忘录。在本示例中,初始时页面只有一个简简单单的欢迎词和文本框,当聚焦文本框开始输入文字,下方出现提交及重置按钮,默认开始时间为当前;点击时间可以重新选择,默认该项目到点前会进行提醒;也可以点绿色开关改成不需要提醒。   页面提交后,下面出现备忘录列表,每行后面有打钩图标用于切换该事项是否已完成、以及X按钮用以删除该事项;当该事项被设为已完成,会跟其他事项有颜色区分。   同时 下面出现一些操作功能,比如切换“显示全部” 以及 “只显示未完成事项”的功能,全部标为已完成、以及删除全部的按钮。   另外当列表存在数据时,下面还有一个按钮保存数据,将当前数据保存到缓存区域,用以下次打开时继续显示个人备忘录状态。   当时间到达有需要提醒的项目前一分钟,或者如果是需要立即开始的当前时间,界面会跳出项目内容,同时播放语音提醒。点击确定表示马上去完成该项目。此时系统会自动将该项目设置为已完成。   个人体会:每个页面的数据绑定(data)是小程序的核心部分,通过setData存入和花括号的读取实现了普通html静态页面没有做到的动态交互;不管是从当前页面提交的表单数据,还是从网络、json文件、api接口读取来的数据在这里交汇并被处理、使用。理解这一点,其他的具体组件/接口等等具体使用方法都是细枝末节了,可以通过查询文档练习掌握。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值