网站开发项目验收报告,服务器销售,app公司开发,石家庄最新数据消息1. 小程序功能 古诗词大全成语大全成语接龙诗词飞花令诗词分享、收藏诗词接龙唐诗宋词起名字百家姓猜谜语2. 小程序预览#xff1a; 3. 部分截图 首页 列表页 详情页 分享页 唐诗宋词 成语接龙 4. 项目结构 .
├── README.md
├── project.config.json … 1. 小程序功能 古诗词大全成语大全成语接龙诗词飞花令诗词分享、收藏诗词接龙唐诗宋词起名字百家姓猜谜语2. 小程序预览 3. 部分截图 首页 列表页 详情页 分享页 唐诗宋词 成语接龙 4. 项目结构 .
├── README.md
├── project.config.json // 项目配置文件
├── cloudfunctions | 云环境 // 存放云函数的目录
│ ├── login // 用户登录云函数
│ │ ├── index.js
│ │ └── package.json
│ └── collection_get // 数据库查询云函数
│ │ ├── index.js
│ │ └── package.json
│ └── collection_update // 数据库更新云函数
│ ├── index.js
│ └── package.json
└── miniprogram├── images // 存放小程序图片├── lib // 配置文件├── pages // 小程序各种页面| ├── index // 首页| └── menu // 分类页| └── user // 用户中心| └── search // 搜索页| └── list // 列表页 搜索结果页| └── detail // 详情页| └── collection // 收藏页| └── find // 发现页| └── idiom-jielong // 成语接龙页| └── poet // 作者页| └── baijiaxing // 百家姓| └── xiehouyu // 歇后语| └── poet // 作者页| └── suggest // 建议反馈| └── ... // 其他├── style // 样式文件目录├── app.js // 小程序入口文件├── app.json // 全局配置└── app.wxss // 全局样式5. 封装云函数操作数据库 本项目是使用的小程序云开发。云开发提供了一个 JSON 数据库用户可以直接在云端进行数据库增删改查但是小程序对用户操作数据的权限进行了一定的限制例如数据update、一次性get记录的条数限制等所以这里主要采用云函数来操作数据库。 查询数据、分页查询 函数根目录上右键在右键菜单中选择创建一个新的 Node.js 云函数我们将该云函数命名为 collection_get。 编辑 index.js // 云函数入口文件
const cloud require(wx-server-sdk)
cloud.init()const db cloud.database()exports.main async (event, context) {/*** page: 第几页* num: 每页几条数据* condition 查询条件例如 { name: 李白 }*/const {database, page, num, condition} eventconsole.log(event)try {return await db.collection(database).where(condition).skip(num * (page - 1)).limit(num).get()} catch (err) {console.log(err)}
}使用 collection_get 云函数 例如按照查询条件{tags: 唐诗三百首}查询诗词列表每页num 10条数据: let {list, page, num} this.data
let that thisthis.setData({loading: true
})wx.cloud.callFunction({name: collection_get,data: {database: gushici,page,num,condition: {tags: 唐诗三百首}},}).then(res {if(!res.result.data.length) { // 没搜索到that.setData({loading: false,isOver: true})} else {let res_data res.result.datalist.push(...res_data)that.setData({list,page: page 1, // 页面加1loading: false})}}).catch(console.error)
} 更新数据 注意当我们向数据库中添加记录时系统会自动帮我们为每条记录添加上用户的 openid 字段但如果数据表是自己用 json/csv 文件导入的就不存在 openid 字段此时当更新这个数据表时系统会认为你不是创建者所以也就无法更新。 此时就需要通过云函数更新数据库新建云函数 collection_update, 编辑 index.js: // 更新数据 - 根据 _id 更新已打开人数
const cloud require(wx-server-sdk)
cloud.init()const db cloud.database()
const _ db.commandexports.main async (event, context) {const { id } eventconsole.log(event)try {return await db.collection(gushici).doc(id).update({data: {opened: _.inc(1)},})} catch (e) {console.error(e)}
} 使用 collection_update 云函数 更新某_id数据的打开人数 let _id e.currentTarget.dataset.id
wx.cloud.callFunction({name: collection_update,data: {id: _id},
}).then(res {console.log(res.data)
})
.catch(console.error) 6. 数据库模糊查询 小程序云开发可以使用正则表达式进行模糊查询。例如 根据用户输入关键词查询标题中存在改关键词的古诗词。 let database gushici
let condition {name: {$regex:.* inputValue,$options: i}
}let { list, page, num } this.data
let that thisthis.setData({loading: true
})// 模糊查询
wx.cloud.callFunction({name: collection_get,data: {database,page,num,condition},
}).then(res {if (!res.result.data.length) { // 没搜索到that.setData({loading: false,isOver: true})} else {let res_data res.result.datalist.push(...res_data)that.setData({list,loading: false})}
})
.catch(console.error) 7. 分享或转发功能 小程序中页面触发转发的方式有两种 1.在小程序的右上角选择转发需要定义函数 Page.onShareAppMessage如果当前页面没有定义此事件则点击后无效果。2.通过给 button 组件设置属性 open-typeshare可以在用户点击按钮后触发 Page.onShareAppMessage 事件如果当前页面没有定义此事件则点击后无效果。用户还可以在 Page.onShareAppMessage 事件中自定义转发后显示的标题、图片、路径 onShareAppMessage(res) {let id wx.getStorageSync(shareId)if (res.from button) {// 来自页面内转发按钮console.log(res.target)}return {title: 跟我一起挑战最长的成语接龙吧,path: pages/find/find,imageUrl: /images/img.jpg,}
}, 注意转发成功/失败的 callback 已经被官方废弃所以理论上小程序是无法得知用户是否将页面分享成功的 8. 用户授权 详情请参考文章微信小程序之授权 9. 需要注意的几个坑 查询不到数据 数据表中明明有数据但是 collection.get 到的却为空。解决可以在云开发控制台中打开数据库权限设置设置权限。 更新数据失败 collection.update 函数调用成功单返回的却是0行记录被更新因为小程序端不允许更新没有 openid 字段的数据。解决可以通过云函数更新数据库。 background 图片 url 不能为本地图片 解决1将图片上传到服务器填写服务器上的图片路径地址。2将图片转为 base64 编码。 往云数据库中批量导入 json 数据失败 原因请看文档https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database/import.html 解决去掉json数据 {}之间的逗号, 如果最外层为 []也必须去掉, 最终形如 {index: 作者_1,type: 作者,poet: 李白,abstract: 李白701年762年字太白号青莲居士唐朝浪漫主义诗人被后人誉为“诗仙”...
}
{index: 作者_2,type: 作者,poet: 白居易,abstract: 白居易772年846年字乐天号香山居士...
} 源码链接 https://github.com/TencentCloudBase/Good-practice-tutorial-recommended 如果你有关于使用云开发CloudBase相关的技术故事/技术实战经验想要跟大家分享欢迎留言联系我们哦~比心 转载于:https://www.cnblogs.com/CloudBase/p/11325702.html
