【生意多】-免费发布分类信息
当前位置: 首页 » 新闻 » 教程 » 小程序 » 正文

手把手教你开发微信小程序中的插件

放大字体  缩小字体 发布日期:2020-07-14 17:54:56    浏览次数:22
导读

  继上次手把手教你实现微信小程序中的自定义组件已经有一段时间了(不了解的小伙伴建议去看看,因为插件很多内容跟组件相似),今年3月13日,小程序新增了 小程序**「插件」版本上,允许开发者开发插件,同时将插件提供给其它小程序使用,这无疑给开发者带来了福音,因为不同的小程序之间可以共享代码啊,这将省去不少的

  继上次手把手教你实现微信小程序中的自定义组件已经有一段时间了(不了解的小伙伴建议去看看,因为插件很多内容跟组件相似),今年3月13日,小程序新增了 小程序**「插件」版本上,允许开发者开发插件,同时将插件提供给其它小程序使用,这无疑给开发者带来了福音,因为不同的小程序之间可以共享代码啊,这将省去不少的开发成本了~

  小程序插件不像自定义组件那样,很方便的就可以嵌在自己的代码中了,它是需要去官网开通小程序插件功能才能使用的,详细的接入流程和文档可以阅读官方的小程序插件接入指南,当然这不是我们本篇文章的重点,本篇文章重点是教你如何开发一个微信小程序插件~

  要开发一个小程序插件,前期准备要充分,我们打开在开发者工具中,我们按照正常步骤新建一个小程序项目,并选择「建立插件快速启动模板」,没有AppID的小伙伴我建议去官网注册一个,因为缺乏AppID,不仅部分功能受到限制,也不方面在真机上调试~

  前者就跟普通小程序一样,我们可以正常开发,后来用来插件调试、预览和审核,不同的是app.json和里多了一些关于插件的配置而已,这些也都是官方帮你完成了,一般也不用配置,当然我们也可以根据自己的实际项目需求做对应的调整~

  有些人可能纳闷了?觉得官方不是现成的示例了,为啥我还要写这篇文章呢?在我看来,官网给的示例过于简单,不足以展示插件的用法,官方给的示例中很多东西都没有涉及到,只是单纯的数据列表渲染,没有交互,这在实际开发中几乎是不存在的,大部分情况下,我们都是要通过插件的回调来进行一系列操作,本篇文章就是专门针对微信官网示例的痛点,分享一下自己的实现过程和思路~

  ok,老规矩,首先先定一个小目标,我们要实现一个省市区选择器的插件,并在点击提交按钮的时候把数据提交过去,大整效果如下图所示~

  首先,我们在components组件文件中创建一个regionPicker文件夹,用来开发我们的省市区选择器,我们右击选择创建component并命名完毕后,就会产生组件的组成部分,即.wxml、.wxss、.json、.js四个文件,我们为了方便,就直接采用微信自带的picker实现~

  跟我们书写自定义组件基本相同,数据绑定在region字段,方法声明在methods对象中,关于自定义组件中js文件中的书写还不是很熟的小伙伴,可以看看官方Component构造器和 我上篇文章自定义组件开发中对其的一些介绍和理解~

  到这里,你已经实现了一个自定义的组件,如何将其以插件的形式让其他小程序应用呢,需要配置两个地方,一个是plugin.json,声明我们的插件;

  另一个是在我们需要的页面中去引入(这里是index.wxml),修改index.json,引入插件

  不对,好像又有问题了,我切换后的数据怎么传过来,我点击提交按钮的时候怎么穿我选择区域呢,确实是,我们接着看~

  我们接下来就要解决上面的问题,首先,我们有了之前开发组件的经验,应该都知道,我们刚才是在properties字段中声明的region,那么我们当然可以对它进行修改,我们在pages/index/index.js中的data字段中也声明一个region,不同的是我们将它的值设置为region: [广东省, 广州市, 海珠区], 再将其绑定到我们的插件上regionPicker region={{region}}/后保存 ,我们会发现现在的插件默认值已经不是北京市, 北京市, 东城区, 而变成了广东省, 广州市, 海珠区, 这样就解决了修改插件默认值的问题,接下来就是回调事件了!

  嗯,其实回调触发也很简单,有过自定义组件开发经验的小伙伴应该早都想到了,跟自定义组件一样,我们只需要在组件change的时候触发回调就可以了,即我们修改regionPicker.js的bindRegionChange方法如下:

  到这里,插件的数据交互传递基本没什么问题了~ 想想,我们还有什么没有用到的呢,插件的api接口,ok,我们接下来就看看这个怎么使用~

  还记得我们之前的插件入口文件index.js么,现在它就要派上用场了,我们在index.js文件中引入我们的api.js,这样我们就可以在插件加载的时候对其进行一些操作,我这里只是单纯的获取了当前用户的设备信息而已:

  后面我们还看到了exports了两个方法getPluginInfo和getSystemInfo,这里暴露出去的方法是方面在插件外部使用,给插件调用者提供接口~

  看到plugin的内容刚好就是我们之前在index.js中通过exports暴露出去的接口,我们调用试试看~

  图书管理系统 Java + MySQL 完整实训代码,MVC三层架构组织,包含所有用到的图片资源以及数据库文件,大三上学期实训,注释很详细,按照阿里巴巴Java编程规范编写

  西北工业大学计算机组成原理实验课唐都仪器实验帮助,同实验指导书。分为运算器,存储器,控制器,模型计算机,输入输出系统5个章节

  最近做了个“罗孚传车”的小程序一时兴起,做了一个小程序,将个人收集的同汽车相关的行业资讯和学习资料,分享到小

  ,既作为历史资料保存,又提供给更多的人学习和了解,还能装一下:)扫描下方小程序码可以体验一下主页面:文章页:个人页:关于页:当然,还和我的公众号罗孚传说关联了:为什么要做

  小程序的简单登录,那段时间我一直在忙着项目,有一天,我清闲下来准备进入小程序群里面看一下来着,刚好有人问问题了,我一看这哥们的问题好像是我写的东西啊,我感觉是时候秀一波了,是时候展现我真正的技术了。我当时正在酝酿如何无形装逼时。这时候出现了一个打脸的。他说这种登录方式不可以使用了,当时我就有点不信了,结果自己测试了真的不可以使用了,没办法,只能更新一版新的了,说实话,那脸打的......

  来说比较头疼的莫过于自定义组件了,当时官方对这方面的文档也只是寥寥几句,一笔带过而已,所以写起来真的是非常非常痛苦!!好在

  小程序的库从 1.6.3 开始,官方对于自定义组件这一块有了比较大的变动,首先比较明显的感觉就是文档比以前全多了,有木有!(小程序文档),现在小程序支持简洁的组件化编程,可以将页面内的功能模块抽象成自定义组件,以便在不同的页面中复用,...

  如果你是一个经常需要接待用户的小程序,可能已经给小程序添加了一个简单的客服功能按钮,让用户更主动和你互动!客服人员可以直接使用

  公众平台网页版客服工具进行客服消息回复。或者使用更智能的第三方小程序客服,来实现更多多维度的操作!比如多达15中的自动回复,以及多载体展现(电脑版网页,用小程序回复客服消息,消息模板推送等) 通过亲身体验之后,发现它能解决如下痛点!(

  来说比较头疼的莫过于自定义组件了,当时官方对这方面的文档也只是寥寥几句,一笔带过而已,所以写起来真的是非常非常痛苦!!好在

  小程序的库从 1.6.3 开始,官方对于自定义组件这一块有了比较大的变动,首先比较明显的感觉就是文档比以前全多了,有木有!(小程序文档),现在小程序支持简洁的组件化编程,可以将页面内的功能模块抽象成自定义组件,...

  过程中,在参数传递,函数返回值等方面,越来越多的使用JSON。JSON(Javascript Object Notation)是一种轻量级的数据交换格式,同时也易于机器解析和生成、易于理解、阅读和撰写,而且Json采用完全独立于语言的文本格式,这使得Json成为理想的数据交换语言。JSON建构于两种结构:“名称/值”对的集合(A Collection of name/va......

  小程序日历组件749264345/w…好,我们先看一下要实现的模样,如下图由以上截图我们可以看到1.日历可以通过按钮【切换展示效果】改变日历的呈现效果,上图是平铺模式,下图是收起滚动模式。2.通过点击具体的日期可以在页面上显示当前选中的具体日期。3.点击【今天】快速回到当日视图。4.点击【◀】和【▶】切换月份。......

  本课程为Python数据挖掘方向的入门课程,课程主要以真实数据为基础,详细介绍数据挖掘入门的流程和使用Python实现pandas与numpy在数据挖掘方向的运用,并深入学习如何运用scikit-learn调用常用的数据挖掘算法解决数据挖掘问题,为进一步深入学习数据挖掘打下扎实的基础。

  环境,安装VS2019,Unity版本,Windows SDK,创建Unity项目,讲解如何使用MRTK,编辑器模拟手势交互,打包VS工程并编译部署应用到HoloLens上等。

 
(文/小编)
打赏
免责声明
• 
本文为小编原创作品,作者: 小编。欢迎转载,转载请注明原文出处:http://www.31duo.com/news/show-381428.html 。本文仅代表作者个人观点,本站未对其内容进行核实,请读者仅做参考,如若文中涉及有违公德、触犯法律的内容,一经发现,立即删除,作者需自行承担相应责任。涉及到版权或其他问题,请及时联系我们。
 

(c)2016-2019 31DUO.COM All Rights Reserved浙ICP备19001410号-4

浙ICP备19001410号-4