wex5 实战 手机电话薄的读取与显示

      用wex5调用codova插件,官方只是提供了一个调用方法,没有相关案例。我通过实际测试,实现了电话薄的读取与显示,并对相关接口调用作了详细说明,希望可以为小白带来一些知识。

一  演示效果:

     先描扫

        

    用wex5的list组件把结果显示出来

    

二 设计思路:

     用codova插件,将结果读取成功后,装入data,用list绑定显示到界面

三  代码实现:

    1 引入 插件

           

           插件有三个主要命令:

           navigator.contacts.create() 新建联系人

           navigator.contacts.save()  保存联系人

           navigator.contacts.find(fields, contactfindSuccess, contactfindError, options); 查找联系人

           navigator.contacts.remove()     删除联系人

           具体用法,下面用实例剖析

   2   新建联系人

       

  3  查询联系人

      界面上放一个input

     

    根据input的值,作为查询条件查询,我作了注释

    

   4  删除联系人

      

      这里是静态联系人,可以用变量

  5  查询所有联系人并显示

     

     (1) 定义全局变量,接收电话薄读取结果

       

     (2)查询所有联系人并弹出提示

            

           (注)查询所有联系人,有成功与失败回调。成功后的回调里可以写入js方法,但不能写wex5的方法。所以结果放到了全局变量this.result数组中;

                   查询结果中的电话,其实是list,也就是说一个人可以有几个电话,为便于测试与data装载,只取了一个电话。其实可以在循环读取行时再套一层循环,读取phone的list

                  具体如下:

                 

        (3)显示所有联系人

                    放入list组件和data组件

                

                 (注)data的字段和查询结果中的键要保持一致。

                   手动装载查询结果,结果自动显示出来

            

                (注)查询结果为json数组,可以装入data,也可以进行异步保存,实现与数据库同步和备份

四  总结

     codova插件,在wex5的集成速度和使用中,效率高,速度快,需要对插件的相关接口和api与wex5的特性相结合。

   

相关视频制作完成,上传优酷。教学app制作中。我是邯郸戏曲开发,tel:15175073123,qq:1017945251

 

 扫描二维码,看高清教学视频。

原文地址:https://www.cnblogs.com/fangziffff123/p/6293868.html