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 // 全局样式
このプロジェクトでは小規模プログラムのクラウド開発を使用します。クラウド開発では JSON データベースが提供され、ユーザーはクラウド上でデータベースを直接追加、削除、変更、クエリできます。ただし、ミニ プログラムではユーザーのデータ操作権限 (データ更新、ワンタイム取得など) に一定の制限が課されます。そのため、ここでは主にクラウド機能を利用してデータベースを運用します。
関数のルート ディレクトリを右クリックし、右クリック メニューで [新しい 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} = event
console.log(event)
try {
return await db.collection(database)
.where(condition)
.skip(num * (page - 1))
.limit(num)
.get()
} catch (err) {
console.log(err)
}
}
たとえば、クエリ条件{tags: '唐诗三百首'}に従って詩のリストをクエリすると、各ページにnum = 10 。
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)
}
データベースにレコードを追加すると、システムが各レコードにユーザーのopenidフィールドを自動的に追加しますが、データ テーブルが json/csv ファイルを使用してインポートされた場合、 openidフィールドは存在しないことに注意してください。今回、このデータテーブルを更新すると、システムはあなたが作成者ではないと判断するため、更新できません。
現時点では、クラウド関数を通じてデータベースを更新し、新しいクラウド関数 collection_update を作成し、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)
}
}
特定の _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)
ミニ プログラム クラウド開発では、正規表現を使用してファジー クエリを実行できます。たとえば、ユーザーのキーワード入力に基づいて、クエリのタイトルには、変更されたキーワードを含む古代の詩が含まれます。
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)
参考記事: Async/await メソッドを使用して WeChat アプレットで非同期リクエストを処理する
ミニ プログラムでページの転送をトリガーするには 2 つの方法があります。
open-type="share" buttonコンポーネントに設定すると、ユーザーがボタンをクリックした後に 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',
}
},
詳細については、記事「WeChat ミニ プログラムの認可」を参照してください。
データテーブルには明らかにデータがありますが、collection.get が取得するものは空です。解決策: クラウド開発コンソールでデータベース権限設定を開いて権限を設定できます。
collection.update 関数の呼び出しが成功すると、レコードの 0 行が更新されたことが返されます。これは、アプレットでは openid フィールドなしでデータを更新することができないためです。解決策: クラウド機能を使用してデータベースを更新できます。
解決策: 1: 画像をサーバーにアップロードし、サーバー上の画像パス アドレスを入力します。 2: 画像を Base64 エンコードに変換します。
理由: ドキュメントを参照してください: 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年），字乐天，号香山居士..."
}
