V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
bokajun
V2EX  ›  微信

第六弹!全球首个微信应用号开发教程!通宵吐血赶稿!

  •  
  •   bokajun · 2016-09-30 09:19:29 +08:00 · 1773 次点击
    这是一个创建于 2975 天前的主题,其中的信息可能已经有所发展或是发生改变。

    大家好!博卡君原计划是能在国庆假期前把小程序的开发教程做完,给大家一套完整、系统的东西,不过由于最近小程序开发工具的拍照组件尚未完善,很多功能还不能顺利实现。我考虑了一下,觉得不如把拍照部分的一些代码展示出来,一来是给大家一个思路,二来也让大家看看目前开发工具存在的一些问题,咱们一起研究研究。

    第九章:微信小程序拍照收纳开发以及删除名片等

    还是先来看看我们今天的主题——拍照收纳。

    拍照收纳分为:上传图片/识别名片、手动填写名片信息两个路径,这里只说下拍照识别,手动填写和前面的编辑名片是同样的页面,大家可以翻翻之前的教程。

    这个布局很快, wxml 没多少内容。

    拍照收纳的原理是收纳名片功能,步骤是打开微信的拍照 API ,同时支持选择本地图片 wx.chooseImage 接口。

    取到图片路径需上传图片文件到后台服务器,这里参照文档打印三个回调。

    但是我发现在开发者工具测试的时候,没有任何打印信息,后台同样也没有接到我上传过去的图片。

    选择一张图片,点击打开后。控制台的 console 没有成功或者失败的回调。

    ** 由于尚处内测版本,暂时还不确定是开发者工具上的 bug 还是 API 接口问题,总之这里影响了小程序开发,我已经写邮件给微信做了反馈。**

    如果图片上传成功,后台取到图片会去调一个识别信息操作,最后把识别到的信息传给我们前台进行渲染,最后把信息保存到名片夹里面,收纳名片流程才算走通。

    再补充下名片夹页面的名片删除吧:

    每个名片夹后面都带个删除功能,这个功能是通过左滑出现。

    点击删除,出现是否确定删除弹框(使用自带的模态框组件)。

    确定与取消事件。

    由于这里名片分为,线上收纳与线下收纳。故而多了个 if 判断,走的删除 request 不是一个接口,其他都相差不多。这里最重要的是要获取到 cardId ,才能知道被删除的是哪张名片。

    名片的父元素绑定的全部事件,以及需要用到的一些自定义参数。 Id 用在左滑上data-card_id 用在页面跳转与删除上,data-card_type 用在判断线上与线下名片。

    cardId 可以在 bindtouchstart 上取到,因为左滑事件是发生 bindtouchstart 事件上。

    当然后面需要用到的值还是先定义个 var 存起来。

    删除完之后还需重新刷新下首页。

    并且提升下用户体验,告诉用户名片删除成功。

    最后一提,当列表很多时,我们需要确定点击到的是那个信息。

    上面的信息都是 block 循环出来的, bindtap 点击事件,然后就是 id=”{{pms.type}}”,重点就是这个 id 来判断被点击的对象。

    操作数据,我们一定要先熟悉好数据的结构,故而在开发前和后台一定要约定好数据结构,熟悉数据结构后,其实开发起来就如庖丁解牛,非常快速(大家开发了小程序后,有没有对 zepoto 与 jQuery 产生反感?哈哈!)

    好了,关于拍照组件的相关内容就写到这里吧!这一章内容就算是博卡君教程的完结篇了。虽然写的内容中包含小程序开发工具的问题,不过我还是推荐大家都尝试调用一下拍照相关功能,看看这些问题在你的机器上会不会出现。按照微信的官方文档,我尝试给 [email protected] 那个邮箱发了邮件报告 bug 。没想到很快收到了官方回复,确认了这点。希望尽快得到更新版,一起期待吧😄

    最后,还是欢迎程序猿朋友们在咱们的 QQ 群多交流,很多涉及具体情况的技术问题,咱们就在群里聊聊吧!

    微信小程序 QQ 交流群: 383863133

    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2791 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 14:27 · PVG 22:27 · LAX 06:27 · JFK 09:27
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.