视频1 P1
视频1 P2
视频1 P3
云存储用来存储图片
云数据库用来存储用户的一些数据以及图片路径之类的
云函数用来处理小程序端无法完成的逻辑
openid是当前用户的唯一标识
视频1 P5
微信小程序 没有找到可以构建的npm包
好像是得需要一个package.json
引入button，
{
"usingComponents": {
"van-button": "@vant/weapp/button"
}
}
那个路径就是就是以miniprogram_npm为根目录的相对路径
如何看Vant API
card api
其中property就是这个组件的属性，slot我不知道，外部样式类指的就是可以对组件内的东西自定义样式
另外，外部样式类无法覆盖框架内部样式的相同类目，因为虽然权重相同，页面样式先加载，框架样式后加载
视频1P7
云函数获取openid
const cloud = require('wx-server-sdk')
cloud.init({
env:cloud.DYNAMIC_CURRENT_ENV;
})
// 云函数入口函数
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext()
return wxContext.OPENID
}
下面的需求是，如果数据库集合里没有当前用户（openid）的用户信息，那么就调用数据库API将当前用户的信息存储进云数据库中，如果有就不存，最后跳转到新的页面去
下面可以看到第一个then中的参数是一个方法，这个方法返回值还是一个promise对象（就是count()），这是异步函数的连续调用方法。第二个then接收的res就是count()的返回值
getUserInfo: function(res) {
const db = wx.cloud.database();
const userInfo = db.collection('userInfo');
wx.cloud.callFunction({
name: 'getOpenId'
}).then(res => {
let openid = res.result;
return userInfo.where({
_openid: openid
}).count()
}).then(res => {
let countNum = res.total;
if (countNum == 0) {
userInfo.add({
data: res.detail.userInfo,
}).then(res => {
console.log("添加用户信息成功");
}).catch(err => {
console.error(err);
})
}
wx.navigateTo({
url: '../add/add'
});
});
}
视频1P8
promise风格连续then
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: res => {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFilePaths
wx.cloud.uploadFile({
cloudPath: 'mouse.jpg',
filePath: tempFilePaths[0], // 文件路径
}).then(res => {
// get resource ID
return photos.add({
data: {
image: res.fileID
}
})
}).then(res => {
console.log(res)
})
},
fail: err => {
console.error(err);
}
})
生成随机文件名，留意下面的`${Date.now()}``方法，即eval里面的值，然后以字符串形式返回
let cloudPath = `${Date.now()}-${Math.floor(Math.random(0, 1) * 1000)}` + filePath.match(/\.[^.]+?$/)
其中appdata可以看当前页面里的数据
wx.showLoading(Object object)需主动调用 wx.hideLoading 才能关闭提示框
为什么options里存着用户购的openid呢，这是因为这个页面是通过index进入的，而index页面进入到该页面的时候，使用的是<navigator url='../user/user?id={{item._openid}}'>
onLoad: function(options) {
console.log(options)
wx.showLoading({
title: '数据加载中',
})
userInfo.where({
_openid: options.id
}).get().then(res => {
this.setData({
userInfo: res.data[0]
})
})
photos.where({
_openid: options.id
}).get().then(res => {
this.setData({
photos:res.data
})
});
wx.hideLoading();
}
视频1P10
getTempFileURL可以promise风格
视频1P11
视频2P1
视频2P2
添加自定义组件一律都tm在app.json里加，别tm像老师那样在具体页面加，费死劲了
也不要像老师那样在每个页面的js里获取数据库引用，直接在app.js添加全局数据
App({
onLaunch: function () {
if (!wx.cloud) {
console.error('请使用 2.2.3 或以上的基础库以使用云能力')
} else {
wx.cloud.init({
// env 参数说明：
// env 参数决定接下来小程序发起的云开发调用（wx.cloud.xxx）会默认请求到哪个云环境的资源
// 此处请填入环境 ID, 环境 ID 可打开云控制台查看
// 如不填则使用默认环境（第一个创建的环境）
env: 'xly',
traceUser: true,
})
}
const db = wx.cloud.database();
const products = db.collection('products');
this.globalData = {
products: products
}
}
})
然后再在具体页面获取
无论是云函数还是小程序，跟云数据库和云函数相关的操作，都要在cloud.init之后进行
云函数向数据库添加数据，不会自动添加openid
补充：获取数据库中数据个数并赋值
下面的代码会失败，因为javascript的异步机制，异步方法会立刻返回继续执行下一步的log方法，then里面的方法会加到消息队列里，等有结果返回了，then里面的方法才会执行。
addData: function(event) {
let count;
products.count().then(res=>{
count=res.total;
})
console.log(count);
}
改成下面的就好
addData: async function(event) {
let count;
await products.count().then(res=>{
count=res.total;
})
console.log(count);
}
视频2P18
现在小程序端也可以进行批量删除了
