智能名片小程序创立名片页性能实现要害代码
创立名片页时,整个操作流程是这样的,表单填写、头像图片上传、地址抉择、表单校验、提交数据至数据库。
表单布局次要form、input、textarea为页面元素,很简略,次要讲一下相干性能点的要害代码实现。
图片上传
调用wx.cloud.uploadFile办法,将图片上传至云存储服务器。
wx.cloud.uploadFile({
cloudPath: cloudPath, // 上传至云端的门路
filePath: this.data.tempFilePath, // 小程序临时文件门路
success: res => {
// 返回文件 ID
const fileID = res.fileID;
},
fail: console.error
})
地址抉择
在页面加个点击事件监听器,而后在js中对应的函数体外面,增加这段代码,即可实现调起地图功能,进行地址抉择。
wx.chooseLocation({
success: function (res) {
// success
that.setData({
address: res.address,
latitude: res.latitude,
longitude: res.longitude
})
},
fail: function () {
// fail
},
complete: function () {
// complete
}
})
表单校验
应用罕用的正则表达式,调用.test()进行校验。
MOBILE_TEST.test(formData.mobile)
提交数据至数据库
将电子名片数据提交至云数据库进行保留。
wx.cloud.database().collection('card').add({})
智能名片小程序创立名片页性能实现要害代码
发表回复