原计划是能把小程序的开发教程做完,给大家一套完整、系统的东西,不过由于最近小程序开发工具的拍照组件尚未完善,很多功能还不能顺利实现
我考虑了一下,觉得不如把拍照部分的一些代码展示出来,一来是给大家一个思路,二来也让大家看看目前开发工具存在的一些问题,咱们一起研究研究
第九章:微信小程序拍照收纳开发以及删除名片等还是先来看看我们今天的主题——拍照收纳
拍照收纳分为:上传图片/识别名片、手动填写名片信息两个路径,这里只说下拍照识别,手动填写和前面的编辑名片是同样的页面,大家可以翻翻之前的教程
这个布局很快,wxml没多少内容
拍照收纳的原理是收纳名片功能,步骤是打开微信的拍照API,同时支持选择本地图片wx
chooseImage接口
取到图片路径需上传图片文件到后台服务器,这里参照文档打印三个回调
但是我发现在开发者工具测试的时候,没有任何打印信息,后台同样也没有接到我上传过去的图片
选择一张图片,点击打开后
控制台的console没有成功或者失败的回调
由于尚处内测版本,暂时还不确定是开发者工具上的bug还是API接口问题,总之这里影响了小程序开发,我已经写邮件给微信做了反馈
如果图片上传成功,后台取到图片会去调一个识别信息操作,最后把识别到的信息传给我们前台进行渲染,最后把信息保存到名片夹里面,收纳名片流程才算走通
再补充下名片夹页面的名片删除吧:每个名片夹后面都带个删除功能,这个功能是通过左滑出现
点击删除,出现是否确定删除弹框(使用自带的模态框组件)
确定与取消事件
由于这里名片分为,线上收纳与线下收纳
故而多了个if判断,走的删除request不是一个接口,其他都相差不多
这里最重要的是要获取到cardId,才能知道被删除的是哪张名片
名片的父元素绑定的全部事件,以及需要用到的一些自定义参数
Id用在左滑上data-card_id用在页面跳转与删除上,data-ca