微信小程序云函数查询数据并展示表格
{
"title": "微信小程序云函数查询数据并展示表格",
"description": "本文介绍了使用微信小程序云函数查询数据并以表格形式展示结果的代码示例，包括数据结构定义、查询函数实现和页面展示代码。",
"keywords": "微信小程序, 云函数, 查询数据, 表格展示, 代码示例",
"content": ""查询云函数为exports.main = async (event, context) => {\n\tconst db = cloud.database();\n\tconst yddata = db.collection('yddata');\n\tconst pageSize = 1000; // 定义每页显示的数据数量\n\tconst startIndex = 0; // 定义起始索引值\n\tlet query = yddata.where({});\n\n\tconst startDate = event.startDate.split('-').join('.') + ' 0:0:0';\n\tconst endDate = event.startDate.split('-').join('.') + ' 0:0:0';\n\n\tif (event.mailNumber) {\n\t query = query.where({ mailNumber: event.mailNumber });\n\t const searchData = await query.orderBy('date', 'desc').skip(startIndex).limit(pageSize).get().then(res => {\n\t if (res.data.length > 0) {\n\t const data = res.data[0];\n\t return {\n\t searchData: data\n\t // mailNumber:data.mailNumber,\n\t // images: data.images,\n\t // describe: data.describe,\n\t // date: data.date\n\t };\n\t } else {\n\t return {\n\t error: '未找到相关数据'\n\t };\n\t }\n\t }).catch(err => {\n\t console.error(err);\n\t return {\n\t error: err\n\t };\n\t });\n\t return searchData;\n\t}else {\n\t query = query.where({\n\t date: db.command.gte(startDate).and(db.command.lte(endDate))\n\t });\n\t const searchData = await query.orderBy('date', 'desc').skip(startIndex).limit(pageSize).get().then(res => {\n\t if (res.data.length > 0) {\n\t const data = res.data[0];\n\t return {\n\t searchData: data\n\t // mailNumber:data.mailNumber,\n\t // images: data.images,\n\t // describe: data.describe,\n\t // date: data.date\n\t };\n\t } else {\n\t return {\n\t error: '未找到相关数据'\n\t };\n\t }\n\t }).catch(err => {\n\t console.error(err);\n\t return {\n\t error: err\n\t };\n\t });\n\t return searchData;\n\t}\n}\njs查询代码如下：\t\tsearch: async function () {\n\t wx.cloud.callFunction({\n\t name: 'searchData',\n\t data: {\n\t mailNumber: this.data.mailNumber,\n\t startDate:this.data.startDate,\n\t endDate: this.data.endDate\n\t },\n\t success: res => {\n\t const searchData = res.result;\n\t if (searchData.error) {\n\t wx.showToast({\n\t title: '未找到相关数据',\n\t icon: 'none'\n\t });\n\t } else {\n\t this.setData({\n\t searchData: searchData.searchData,\n\t // images: searchData.images,\n\t // describe: searchData.describe,\n\t // date: searchData.date\n\t });\n\t }\n\t },\n\t fail: err => {\n\t console.error(err);\n\t }\n\t });\n\t },怎么定义查询返回的多个data类型的数据，data如下\t\tdata: {\n\t mailNumber: '', // 邮件编号\n\t images: [], // 保存的图片列表\n\t describe:'',\n\t date:'',\n\t startDate: '',\n\t endDate: '',\n\t searchData: {} // 存储查找到的数据\n\t},修改代码实现以表格形式显示数据，怎么修改代码内容：要定义查询返回的多个data类型的数据，可以在data中定义一个数组来存储多个数据对象。例如：\n\ndata: {\n\tmailNumber: '', // 邮件编号\n\timages: [], // 保存的图片列表\n\tdescribe:'',\n\tdate:'',\n\tstartDate: '',\n\tendDate: '',\n\tsearchData: [] // 存储查找到的数据，使用数组形式\n}\n\n在查询成功后，将返回的搜索数据存储到searchData数组中：\n\nthis.setData({\n\tsearchData: searchData.searchData,\n\t// images: searchData.images,\n\t// describe: searchData.describe,\n\t// date: searchData.date\n});\n\n修改代码以表格形式显示数据，可以使用wx:for循环遍历searchData数组，将每个数据项显示在表格的每一行中。例如：\n\n
原文地址: https://www.cveoy.top/t/topic/pTTl 著作权归作者所有。请勿转载和采集!