miniprogram project
1.0.0
https://www.cnblogs.com/cckui/p/10228795.html
.
├── 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 // 全局样式
Proyek ini menggunakan pengembangan cloud program kecil. Pengembangan cloud menyediakan database JSON, dan pengguna dapat menambah, menghapus, memodifikasi, dan menanyakan database secara langsung di cloud. Namun, program mini menerapkan batasan tertentu pada izin pengguna untuk mengoperasikan data (seperti pembaruan data, pengambilan satu kali). batas jumlah catatan, dll.). Oleh karena itu, fungsi cloud terutama digunakan di sini untuk mengoperasikan database.
Klik kanan pada direktori root fungsi, dan di menu klik kanan, pilih Buat fungsi cloud Node.js baru. Kami memberi nama fungsi cloud collection_get.
Edit indeks.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} = event
console.log(event)
try {
return await db.collection(database)
.where(condition)
.skip(num * (page - 1))
.limit(num)
.get()
} catch (err) {
console.log(err)
}
}
Misalnya, kueri daftar puisi sesuai dengan kondisi kueri {tags: '唐诗三百首'} , dan setiap halaman num = 10 buah data:
let {list, page, num} = this.data
let that = this
this.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.data
list.push(...res_data)
that.setData({
list,
page: page + 1, // 页面加1
loading: false
})
}
})
.catch(console.error)
}
Perhatikan bahwa ketika kita menambahkan record ke database, sistem akan secara otomatis menambahkan field openid pengguna ke setiap record untuk kita. Namun, jika tabel data diimpor sendiri menggunakan file json/csv, tidak akan ada field openid Di kali ini, ketika memperbarui tabel data ini, sistem akan menganggap bahwa Anda bukan pembuatnya, sehingga tidak dapat diperbarui.
Saat ini, Anda perlu memperbarui database melalui fungsi cloud, membuat fungsi cloud collection_update baru, dan mengedit index.js:
// 更新数据 - 根据 _id 更新已打开人数
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
const _ = db.command
exports.main = async (event, context) => {
const { id } = event
console.log(event)
try {
return await db.collection('gushici').doc(id)
.update({
data: {
opened: _.inc(1)
},
})
} catch (e) {
console.error(e)
}
}
Update jumlah orang yang membuka data _id tertentu:
let _id = e.currentTarget.dataset.id
wx.cloud.callFunction({
name: 'collection_update',
data: {
id: _id
},
}).then(res => {
console.log(res.data)
})
.catch(console.error)
Pengembangan cloud program mini dapat menggunakan ekspresi reguler untuk melakukan kueri fuzzy. Misalnya, menurut masukan kata kunci pengguna, judul kueri berisi puisi kuno dengan kata kunci yang diubah.
let database = 'gushici'
let condition = {
name: {
$regex:'.*'+ inputValue,
$options: 'i'
}
}
let { list, page, num } = this.data
let that = this
this.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.data
list.push(...res_data)
that.setData({
list,
loading: false
})
}
})
.catch(console.error)
Artikel referensi: Menggunakan metode Async/menunggu untuk menangani permintaan asinkron di applet WeChat
Ada dua cara untuk memicu penerusan halaman di program mini:
open-type="share" ke komponen button , peristiwa Page.onShareAppMessage dapat dipicu setelah pengguna mengklik tombol. Jika peristiwa ini tidak ditentukan pada halaman saat ini, tidak akan ada efek setelahnya mengklik.Pengguna juga dapat menyesuaikan judul, gambar, dan jalur yang ditampilkan setelah penerusan di acara 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',
}
},
Untuk detailnya, silakan merujuk ke artikel: Otorisasi Program Mini WeChat
Jelas ada data di tabel data, tetapi yang didapat collection.get kosong. Solusi: Anda dapat membuka pengaturan izin database di konsol pengembangan cloud dan mengatur izin.
Panggilan yang berhasil ke fungsi collection.update mengembalikan 0 baris catatan yang telah diperbarui, karena applet tidak mengizinkan pembaruan data tanpa bidang openid. Solusi: Basis data dapat diperbarui melalui fungsi cloud.
Solusi: 1: Unggah gambar ke server dan isi alamat jalur gambar di server. 2: Konversikan gambar ke pengkodean base64.
Alasan: Silakan lihat dokumen: https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database/import.html
Solusi: Hapus tanda koma di antara {} pada data json. Jika layer terluar adalah [] , maka bentuk akhirnya adalah sebagai berikut:
{
"index": "作者_1",
"type": "作者",
"poet": "李白",
"abstract": "李白（701年－762年），字太白，号青莲居士，唐朝浪漫主义诗人，被后人誉为“诗仙”..."
}
{
"index": "作者_2",
"type": "作者",
"poet": "白居易",
"abstract": "白居易（772年－846年），字乐天，号香山居士..."
}
