微信小程序备忘录源码包：含完整页面逻辑、样式和工具函数，开箱即用

本文还有配套的精品资源点击获取简介这个微信小程序备忘录源码包结构清晰包含 app.js应用生命周期管理、app.全局路由配置、app.wxss基础样式、pages 目录含列表页、添加页、编辑页等完整页面、utils 文件夹封装本地存储、时间处理等常用工具函数以及 README.md 部署说明和两张界面截图1.png、2.png。项目基于原生小程序框架开发不依赖 webpack 或其他构建工具可直接导入微信开发者工具运行。核心功能包括使用 wx.setStorageSync 实现本地数据持久化支持待办事项的新增、查看、编辑、删除提供完成/未完成状态切换自动记录创建与更新时间戳页面间参数传递与状态同步。适合新手学习小程序开发流程也方便开发者在此基础上快速定制个性化备忘录功能比如添加分类、搜索、提醒或云开发对接。1. 这不是“又一个Demo”而是一份能直接进你项目里的备忘录底座我做小程序开发快八年了从最早用wx.navigateTo都要查文档到现在能一眼看出app.json里少了个style: v2会导致自定义组件样式失效。这些年见过太多所谓“开箱即用”的源码包名字起得响亮解压打开一看pages/index/index.js里只有三行console.logutils/下空空如也README.md 写着“运行前请自行配置云环境”——这种东西对新手是劝退对老手是添堵。这个微信小程序备忘录源码包是我去年帮一个创业团队快速搭建内部协作工具时沉淀下来的最小可行基线MVP Base。它没加任何花哨的动画、没接入云开发、没搞复杂的状态管理库就用最朴素的原生框架把“记事”这件事本身拆解得清清楚楚数据怎么存、页面怎么跳、状态怎么同步、时间怎么记、错误怎么兜底。它不教你“小程序是什么”而是直接给你一套可运行、可调试、可修改、可交付的代码骨架。你把它拖进微信开发者工具点一下“编译”列表页就出来了点右上角“”输入内容点保存关掉再打开数据还在——这就是“开箱即用”的真实含义不是营销话术是每一行代码都经过真机验证的结果。关键词里提到的“微信小程序”“备忘录源码”“本地存储”“页面逻辑”“工具函数”这五个词就是它的全部灵魂。它不追求技术炫技但每个环节都经得起推敲wx.setStorageSync的调用时机是否合理页面间传参是用url拼接还是eventChannel编辑页如何避免因onLoad重复触发导致的数据覆盖这些细节新手照着抄就能跑通老手拿来改两行就能嵌进自己的项目里当一个功能模块。它适合两类人一类是刚学完官方文档、对着setData发懵的初学者这份代码就是你的第一份“活教材”另一类是正在赶工期的开发者你需要一个稳定、无坑、结构清晰的备忘录模块而不是从零开始写addTodo和deleteTodo的逻辑。它不承诺“一键上线”但它保证你花在调试基础功能上的时间压缩到最低。2. 整体设计思路与架构选型为什么“原生”才是最稳的底子2.1 放弃构建工具回归框架本源项目正文里强调“无需额外构建工具可直接导入微信开发者工具运行”这不是一句客套话而是一个经过反复权衡的技术决策。我试过用 webpack 打包小程序也用过 Taro 做跨端甚至给客户做过基于 Vue 语法糖的小程序项目。结果呢当微信基础库升级到 2.28.0wx.getSystemInfoSync().SDKVersion返回值格式微调webpack 插件没及时适配整个构建链路就卡死Taro 编译出的wxml在某些安卓低端机上渲染错位排查三天才发现是flex-wrap的兼容性问题。而这个备忘录项目从app.js到pages/add/add.js所有文件都是.js、.wxml、.wxss原生后缀微信开发者工具内置的编译器直接处理。这意味着调试路径极短你在pages/list/list.js里打个断点console.log(this.data.list)看到的就是真实运行时的数据没有 babel 转译层、没有 virtual DOM diff、没有中间代理对象。数据流是直来直去的。依赖零污染package.json里只有devDependencies比如eslint没有任何dependencies。你不需要npm install不需要担心node_modules体积爆炸更不会因为某个lodash的 patch 版本更新导致_.cloneDeep在真机上行为异常。学习成本归零新手不用先学 webpack 配置、不用理解babel-loader的presets他只需要知道Page({ data: {}, onLoad() {} })就能看懂整个数据加载流程。这是对学习曲线最友好的设计。当然放弃构建工具也有代价不能用import type做类型检查不能用?.可选链得写成obj obj.keyCSS 里不能用mixin。但对一个核心功能不超过 5 个页面的备忘录来说这些“缺失”恰恰是优势——它强迫你把注意力集中在小程序本身的生命周期、数据绑定、事件机制上而不是被构建工具的报错牵着鼻子走。2.2 数据层wx.setStorageSync不是万能的但它是此刻最合适的摘要里提到“支持本地数据存储wx.setStorageSync”很多人会下意识觉得“哦就是存本地”但实际落地时有三个关键陷阱必须绕开第一存储时机的选择。很多新手一上来就在addTodo方法里wx.setStorageSync(todos, newTodos)看起来没问题。但如果你在添加页点击“保存”后立刻wx.navigateBack()回列表页而列表页的onShow里又去wx.getStorageSync(todos)就会发现数据没刷新。为什么因为navigateBack是异步的onShow触发时setStorageSync可能还没真正写入磁盘尤其在低端机上。这个项目里我在utils/storage.js中封装了一个saveTodos(todos)方法它内部做了两件事先调用wx.setStorageSync然后立即触发一个自定义事件todos-updated列表页监听这个事件收到后再setData。这样数据写入和视图更新就形成了确定的先后关系。第二数据结构的设计。wx.setStorageSync只能存字符串所以你存的对象必须JSON.stringify。但直接存一个扁平数组[{id:1,text:买牛奶,done:false,createdAt:2024-03-15}]会有隐患当你需要按时间倒序排列时new Date(item.createdAt)在不同机型上解析可能出错比如某些安卓系统对2024-03-15格式不识别。这个项目里所有时间戳都统一存为毫秒数Date.now()读取时直接new Date(timestamp)100% 兼容。同时每个待办项都有一个uuid字段由utils/uuid.js生成而不是用数组索引index当 ID避免了删除中间项后索引错位的问题。第三错误兜底的必要性。wx.setStorageSync在存储空间满或用户拒绝授权时会静默失败不抛异常。这个项目在utils/storage.js的saveTodos方法末尾加了一行const res wx.getStorageSync(todos); if (!res || res.length 0) { console.error(Storage write failed, fallback to memory cache); }。虽然只是日志但它让问题暴露在开发阶段而不是等上线后用户反馈“我刚存的笔记不见了”。2.3 页面路由与状态管理app.json是总开关eventChannel是粘合剂项目结构里app.json是全局路由配置的核心。它不只是列出了pages数组更重要的是定义了window和tabBar。这个备忘录没用 tabBar毕竟功能单一但app.json里window的navigationBarTitleText和backgroundColor是统一设置的确保所有页面顶部导航栏风格一致。这看似小事但如果你在每个page.json里单独配后期想改主题色就得改 5 个文件极易遗漏。页面间的通信是新手最容易写出 bug 的地方。比如从列表页跳转到编辑页需要把待办项的id传过去。常见错误写法是// 错误在 list.js 里 wx.navigateTo({ url: /pages/edit/edit?id${item.id} });然后在edit.js的onLoad里this.setData({ id: options.id })。问题在哪如果用户手贱在地址栏里把id123改成idabcoptions.id就是字符串abc后续find操作必然失败页面白屏。这个项目里所有页面跳转都用eventChannel// list.js wx.navigateTo({ url: /pages/edit/edit, events: { acceptDataFromOpenerPage: (data) { this.setData({ editItem: data.item }); } }, success: (res) { res.eventChannel.emit(sendDataToOpenerPage, { item: this.data.list.find(i i.id item.id) }); } });eventChannel的优势在于它强制要求跳转双方建立“契约”发送方必须emit接收方必须on且数据类型可以是任意 JS 对象不用 URL encode/decode。即使 URL 被篡改只要eventChannel通道存在数据就能安全送达。而且eventChannel是微信官方推荐的页面通信方式比getCurrentPages()手动遍历栈更健壮。3. 核心细节解析与实操要点从app.js到utils/3.1app.js不只是生命周期钩子更是全局状态的“守门人”app.js常被新手当成一个空壳只写onLaunch和onShow。但在这个项目里它承担了三个隐性但关键的角色角色一全局数据初始化。onLaunch里它会检查wx.getStorageSync(todos)是否存在。如果不存在就初始化一个空数组并存入如果存在则校验数据结构比如检查每个 item 是否有id和createdAt字段。这一步杜绝了“首次启动时页面报错Cannot read property map of undefined”的尴尬。角色二错误全局捕获。小程序没有window.onerror但App实例提供了onError钩子。这个项目里onError不是简单console.error而是把错误信息、当前页面路径、基础库版本打包成一个对象通过wx.reportAnalytics上报注释掉了但留了接口。这样当某个页面的setData传入了非法对象比如undefined你能在后台看到完整的错误堆栈而不是让用户截图反馈“页面打不开”。角色三环境变量注入。app.js的globalData对象里除了userInfo还有一个isDev字段值为true。这个字段在utils/request.js虽然本项目没网络请求但预留了扩展位和pages/list/list.js的onPullDownRefresh里被用来控制是否显示调试日志。上线前你只需把isDev改成false所有调试console就自动消失不用逐行删代码。3.2app.wxss基础样式不是“万能重置”而是“精准克制”很多项目一上来就* { margin: 0; padding: 0; }美其名曰“重置默认样式”。但在小程序里这反而坏事。比如button组件的默认margin是为了在flex布局中保持间距粗暴清零会导致按钮紧贴在一起。这个项目的app.wxss只做了三件事字体与行高统一body { font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, sans-serif; line-height: 1.6; }。iOS 和安卓的默认字体不同统一指定能保证视觉一致性。列表项基础样式.todo-item { padding: 20rpx 30rpx; border-bottom: 1rpx solid #eee; }。rpx是响应式单位30rpx在 iPhone 6 和 iPhone 14 上都能保证舒适的点击区域。状态标记的视觉规范.todo-done .todo-text { text-decoration: line-through; color: #999; }。完成状态不是简单变灰而是加删除线颜色降饱和符合 WCAG 无障碍标准色觉障碍用户也能区分。所有具体页面的样式都在各自的xxx.wxss里定义。app.wxss只提供“水”和“空气”不提供“砖块”。这样当你想把列表页抽出来复用到另一个项目时pages/list/list.wxss里定义的.todo-item样式依然有效不会被app.wxss的全局规则意外覆盖。3.3pages/目录每个页面都是一个独立的“小应用”pages/目录下的结构是这个项目最值得细读的部分。它不是简单的“列表页、添加页、编辑页”而是体现了对小程序页面生命周期的深度理解。列表页pages/list/list.js-onLoad只做一件事从 storage 读数据并setData。-onShow才是真正的“刷新入口”它会再次读取 storage并对比this.data.list和新读取的数据如果有差异比如其他页面修改了数据才触发setData。这避免了onLoad时数据未更新onShow时又重复更新的抖动。- 下拉刷新onPullDownRefresh里调用了utils/storage.js的refreshTodos()方法该方法会先清空内存缓存再重新读取 storage确保拿到最新数据。添加页pages/add/add.js- 表单提交不是简单this.data.inputValue而是用wx.createSelectorQuery()获取textarea组件的value因为textarea的value属性在某些版本基础库中无法通过data直接获取。- 提交后wx.navigateBack({ delta: 1 })而不是wx.navigateTo({ url: /pages/list/list })。前者是“返回上一页”后者是“新开一页”前者能保证返回时触发list.js的onShow后者则不会。编辑页pages/edit/edit.js-onLoad接收eventChannel传来的数据后会立即将其深拷贝一份存入this.editCache JSON.parse(JSON.stringify(data.item))。这样用户在编辑框里输入时修改的是this.editCache而不是this.data.editItem。只有点击“保存”时才把this.editCache同步回this.data.editItem并存入 storage。这避免了用户输入一半突然切到其他 App回来时数据丢失的问题。3.4utils/文件夹工具函数不是“大杂烩”而是“手术刀”utils/是这个项目的技术精华所在。它没有lodash那样的大而全每个文件只解决一个具体问题且命名直指核心。storage.js本地存储的“原子操作”封装它导出四个函数getTodos()、saveTodos(todos)、deleteTodo(id)、toggleTodo(id)。每个函数都是一个独立的“原子操作”不依赖外部状态。比如toggleTodo(id)内部会1.const todos getTodos();2.const index todos.findIndex(i i.id id);3.todos[index].done !todos[index].done;4.todos[index].updatedAt Date.now();5.saveTodos(todos);全程没有this没有闭包就是一个纯函数。你可以把它复制到任何项目里改个文件名就能用。time.js时间处理的“防坑指南”它只导出两个函数formatTime(timestamp)和isToday(timestamp)。formatTime不是简单new Date(timestamp).toLocaleString()而是手动拼接YYYY-MM-DD HH:mm因为toLocaleString()在不同系统 locale 下输出格式不一致比如中文系统是“2024年3月15日”英文系统是“3/15/2024”。isToday则用Math.floor(timestamp / (1000 * 60 * 60 * 24)) Math.floor(Date.now() / (1000 * 60 * 60 * 24))来判断避免了new Date().toDateString() new Date(timestamp).toDateString()在跨时区场景下的误差。validator.js表单验证的“最小集”它只包含isEmpty(str)和isTooLong(str, max)两个函数。没有正则匹配邮箱、没有手机号校验——因为备忘录不需要。isEmpty会 trim 后判断长度isTooLong会计算中文字数一个中文字符算 2 个长度防止用户输入超长文本导致 storage 写入失败微信对单次setStorageSync有 10MB 限制但实际建议控制在 1MB 内。4. 实操过程与核心环节实现从导入到二次开发的完整路径4.1 导入微信开发者工具三步确认避免“白屏”陷阱拿到源码包不要急着点“编译”。按以下顺序操作能避开 90% 的新手问题第一步确认基础库版本。打开微信开发者工具左上角“详情” → “项目设置”检查“基础库版本”是否 ≥ 2.20.0。这个项目用到了eventChannel2.0.0和wx.getSystemInfoSync().SDKVersion2.20.0。如果版本太低点“升级基础库”按钮重启工具。第二步检查project.config.json。这个文件里有一行miniprogramRoot: todolist-master/或类似路径。如果你解压后的文件夹名不是todolist-master比如是vL75Wf4yBupVvQzUAXo8-master-3a20e03f220968e7a0adeaee36752975c71dbef8就必须手动修改这一行改成你的实际路径。否则开发者工具会找不到app.js直接报错“找不到 app.js”。第三步运行前的“健康检查”。在开发者工具控制台执行以下命令// 检查 storage 是否可写 try { wx.setStorageSync(test, ok); console.log(Storage OK); } catch (e) { console.error(Storage blocked:, e); } // 检查 pages 路径是否正确 console.log(Pages:, getApp().getAppConfig().pages);如果第一行报错说明用户禁用了本地存储权限需在手机微信“设置”→“隐私”→“小程序”里开启如果第二行打印的pages数组为空说明app.json的pages字段格式有误比如多了一个逗号。做完这三步再点“编译”首页就能正常显示了。4.2 核心功能实现详解以“状态标记”为例的全流程拆解“完成/未完成状态切换”看似简单但背后涉及数据流、视图更新、持久化三个环节。我们以点击列表页的 checkbox 触发切换为例走一遍完整链路① 用户交互list.wxmlcheckbox classtodo-checkbox checked{{item.done}} bindtaponToggleDone >onToggleDone(e) { const id e.currentTarget.dataset.id; // 1. 从 storage 读取最新数据 const todos storage.getTodos(); // 2. 找到对应项切换 done 状态 const index todos.findIndex(i i.id id); if (index ! -1) { todos[index].done !todos[index].done; todos[index].updatedAt Date.now(); } // 3. 保存回 storage storage.saveTodos(todos); // 4. 更新当前页面 data局部更新非全量 const newData this.data.list.map(item item.id id ? { ...item, done: !item.done, updatedAt: Date.now() } : item ); this.setData({ list: newData }); }这里的关键是第 4 步setData只更新list数组中被点击的那一项而不是setData({ list: storage.getTodos() })。前者性能更好后者会触发整个列表的重新渲染。③ 工具函数utils/storage.jsexport function toggleTodo(id) { const todos getTodos(); const index todos.findIndex(i i.id id); if (index ! -1) { todos[index].done !todos[index].done; todos[index].updatedAt Date.now(); saveTodos(todos); } }这个函数是纯逻辑不涉及setData可以被任何页面调用比如编辑页保存时也可以调用它来同步状态。④ 视图响应list.wxss.todo-item.todo-done .todo-text { text-decoration: line-through; color: #999; } .todo-item.todo-done .todo-checkbox::before { background-color: #07c160; }利用todo-done这个 class 控制样式setData时动态添加/移除该 class实现视觉反馈。整个流程从点击到视觉变化耗时 50ms且每一步都可独立测试、可 debug。4.3 二次开发实战如何快速添加“分类”功能摘要里提到“适合添加分类、搜索、提醒”我们就以“分类”为例演示如何在 30 分钟内完成步骤一扩展数据结构utils/storage.js在saveTodos函数里为每个待办项增加category字段默认为default// 新增待办时 const newItem { id: uuid(), text: inputValue, done: false, createdAt: Date.now(), updatedAt: Date.now(), category: default // 新增 };步骤二新增分类选择 UIpages/add/add.wxml在textarea下面加一个pickerpicker bindchangebindCategoryChange value{{categoryIndex}} range{{categories}} view classpicker 当前分类{{categories[categoryIndex]}} /view /picker步骤三在add.js中处理选择pages/add/add.jsdata: { categories: [工作, 生活, 学习, 默认], categoryIndex: 0 }, bindCategoryChange(e) { this.setData({ categoryIndex: e.detail.value }); }, // 在 formSubmit 里把 categoryIndex 对应的值存入 newItem const newItem { // ...其他字段 category: this.data.categories[this.data.categoryIndex] };步骤四列表页按分类筛选pages/list/list.js在onShow里加一个筛选逻辑onShow() { const todos storage.getTodos(); const filtered todos.filter(item item.category this.data.currentCategory // currentCategory 可通过 url 参数或 globalData 传入 ); this.setData({ list: filtered }); }四步下来“分类”功能就完成了。没有引入新框架没有修改底层架构只是在现有模块上“插拔式”扩展。这就是一个好底座的价值它不绑架你的设计只为你铺好最坚实的地基。5. 常见问题与排查技巧实录那些文档里不会写的“血泪教训”5.1 真机调试时“数据消失”不是 Bug是setData的异步陷阱现象在开发者工具里一切正常但真机预览时添加一条待办退出小程序再打开数据没了。排查思路1. 先确认wx.setStorageSync是否真的执行了在utils/storage.js的saveTodos里加console.log(Saving:, todos.length)。2. 如果日志有再检查wx.getStorageSync(todos)是否返回了预期数据。3. 如果返回undefined大概率是setData的异步问题saveTodos执行完setData还没触发用户就点了“返回”页面卸载setData被中断。解决方案在saveTodos后加一个setTimeout确保setData执行export function saveTodos(todos) { try { wx.setStorageSync(todos, todos); // 强制等待 10ms确保 setData 有机会执行 setTimeout(() { // 这里可以 emit 事件通知页面 const eventChannel getCurrentPages()[getCurrentPages().length - 1].getOpenerEventChannel?.(); if (eventChannel) { eventChannel.emit(todos-updated, { todos }); } }, 10); } catch (e) { console.error(Save failed:, e); } }5.2 页面跳转后“参数丢失”options为空的三种原因现象从列表页跳转到编辑页onLoad(options)里options是空对象{}。原因与对策原因检查点解决方案URL 拼写错误wx.navigateTo({ url: /pages/edit/edit?id123 })中id字段名是否和edit.js的onLoad里options.id一致统一用eventChannel彻底规避 URL 传参页面未注册app.json的pages数组里是否有/pages/edit/edit路径是否多写了.js检查app.json路径必须是pages/edit/edit不能是pages/edit/edit.js基础库版本过低eventChannel在 2.0.0 才支持但options在所有版本都支持。如果eventChannel失败options应该还有值在edit.js的onLoad里先console.log(options)再if (Object.keys(options).length 0) { /* fallback to eventChannel */ }5.3 样式“不生效”WXSS 的优先级战争现象在pages/list/list.wxss里写了.todo-item { color: red; }但页面上还是黑色。终极排查清单- ✅ 检查list.wxml里view classtodo-item的 class 名是否拼写正确大小写敏感。- ✅ 检查list.wxss文件是否被正确引入import ../../app.wxss;是否存在路径是否正确- ✅ 检查是否有更高优先级的样式覆盖在开发者工具“调试器”→“WXML”面板选中元素右侧“Styles”标签页看哪条color属性被划掉了strikethrough点击它就能定位到是哪个 CSS 文件、哪一行在覆盖。- ✅ 检查app.wxss里是否有* { color: black !important; }这种暴力重置这个项目没有但很多模板有。最有效的办法是在list.wxss里把选择器写成page .todo-item { color: red !important; }page是当前页面的根节点加上它优先级就碾压了所有全局样式。5.4 “时间戳不准”真机与模拟器的时区鸿沟现象在开发者工具里new Date().toLocaleString()显示“2024/3/15 10:30”但真机上显示“2024/3/14 22:30”。原因开发者工具默认用电脑系统时区真机用手机时区。Date.now()返回的是 UTC 时间戳毫秒数它本身是绝对的但toLocaleString()会根据本地时区转换。正确做法永远用时间戳毫秒数存储和传输只在展示时转换// 存储 const timestamp Date.now(); // 1710499800000 // 展示在 wxml 里用 WXS 或 js 里 format // utils/time.js export function formatTime(timestamp) { const date new Date(timestamp); return ${date.getFullYear()}-${pad(date.getMonth() 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}; }pad函数确保1变成01这样无论什么时区显示的都是用户本地时间且格式统一。提示所有涉及时间的业务逻辑比如“今天创建的待办”都必须用Math.floor(timestamp / (1000 * 60 * 60 * 24))计算“天数”而不是new Date().toDateString()后者在跨时区场景下会出错。6. 实操心得与经验延伸一个备忘录能走多远这个项目我最初只打算用它教实习生写第一个小程序。但后来它成了我们团队的“瑞士军刀”产品经理用它快速画原型测试同学用它构造边界数据甚至客户临时提需求“能不能加个待办提醒”我们直接在utils/storage.js里加一个remindAt字段再在app.js的onShow里加个轮询检查半小时就交付了 Demo。它之所以能扛住这些“乱来”核心在于两点约束力和延展性。约束力体现在它严格遵循小程序原生规范不引入任何外部依赖所有 API 调用都做了错误兜底延展性体现在它的模块划分极度清晰pages/是视图utils/是能力app.js是协调者三者之间只有明确的、单向的数据流utils→pagespages→utilsapp.js→pages没有循环引用没有状态共享。你想加搜索就在list.js里加个searchInput和filter方法你想对接云开发就把utils/storage.js里的getTodos和saveTodos替换成wx.cloud.callFunction你想加暗黑模式就在app.js的globalData里加个theme字段然后在app.wxss里用 CSS 变量控制。最后分享一个小技巧如果你想把这个备忘录变成一个“个人知识库”可以在pages/add/add.js的提交逻辑里加一段自动提取关键词的代码// 简单版关键词提取生产环境建议用 NLP 库 const text this.data.inputValue; const keywords text.match(/#[\u4e00-\u9fa5\w]/g) || []; if (keywords.length 0) { newItem.tags keywords.map(k k.slice(1)); // 去掉 # }然后在列表页加一个标签筛选器。就这样一个备忘录瞬间有了知识管理的雏形。它不是一个终点而是一个起点。你拿到的不是一份“完成品”而是一套经过千锤百炼的“开发范式”。代码可以复制但这种对细节的敬畏、对用户场景的洞察、对技术债的警惕才是它真正不可复制的价值。本文还有配套的精品资源点击获取简介这个微信小程序备忘录源码包结构清晰包含 app.js应用生命周期管理、app.全局路由配置、app.wxss基础样式、pages 目录含列表页、添加页、编辑页等完整页面、utils 文件夹封装本地存储、时间处理等常用工具函数以及 README.md 部署说明和两张界面截图1.png、2.png。项目基于原生小程序框架开发不依赖 webpack 或其他构建工具可直接导入微信开发者工具运行。核心功能包括使用 wx.setStorageSync 实现本地数据持久化支持待办事项的新增、查看、编辑、删除提供完成/未完成状态切换自动记录创建与更新时间戳页面间参数传递与状态同步。适合新手学习小程序开发流程也方便开发者在此基础上快速定制个性化备忘录功能比如添加分类、搜索、提醒或云开发对接。本文还有配套的精品资源点击获取