2018.3.13微信小程序插件重大功能更新!
发表时间:2023-08-31 08:09:52
文章来源:炫佑科技
浏览次数:142
菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技
2018.3.13微信小程序插件重大功能更新!
昨天(2018年3月13日),微信小程序发布重大功能更新,支持插件的使用和开发。 我个人预测,不出2个月,优质服务的插件将会如雨后春笋般涌现。
在这篇文章中2018.3.13微信小程序插件重大功能更新!,我将带您学习如何从零开始开发和使用插件。 文章分为3章:
注:为了保存文字内容,我将“微信小程序插件”简称为“插件”。
什么是微信小程序插件?
插件是由js和自定义组件封装的一组代码库。 插件不能单独使用或预览。 它们必须嵌入到其他小程序应用中才能使用。 和NPM的依赖、Maven的依赖库是一样的。
不过插件与NPM、Maven依赖管理的区别在于:
因此,我认为:未来插件应该被第三方封装为服务,而不仅仅是代码库。
如何开发微信小程序插件?
下载*新的微信小程序开发工具(必须是1.02.以上版本),打开开发工具,进入小程序项目,我们会看到“代码片段”标签,如下图:
点击右下角“创建”按钮,创建插件,如下图:
插件的AppId与之前微信小程序的AppId相同。 需要在微信开发后台新建一个微信小程序插件:

微信小程序插件的名称也必须是唯一的。 申请完成后,即可获取插件的AppId。
填写名称和插件AppID后,进入小程序项目,如下图:

项目的代码目录结构如下:
├──
│ ├── app.js
│ ├── app.json
│ └── 页数
├──
│ ├── API
│ ├──
│ ├──index.js
│ └── .json
└── ..json
在..json文件中我们看到代码如下:
{
"miniprogramRoot": "./miniprogram",
"pluginRoot": "./plugin",
"compileType": "plugin",
"setting": {
"newFeature": true
},
"appid": ".....",
"projectname": "videoPlayer",
"condition": {}
}
/.json文件中,代码如下:
{
"publicComponents": {
"hgPlayer": "components/player/player"
},
"main": "index.js"
}
在/index.js文件中,代码如下:
var data = require('./api/data.js')
module.exports = {
getData: data.getData,
setData: data.setData
}
外部抛出接口在/index.js中定义。 小程序使用该插件时,只能使用该插件提供的这两个接口。 小程序无法使用插件的其他接口(或方法)。
完成上述配置后,就可以开始在/中编写组件代码了。 比如我写了我的播放器组件,代码如下:
.js:
Component({
data: {
myData:[]
}
})
.wxml:
值得一提的是:
编写组件就是调用()来定义组件代码,这和App()、Page()是一样的。
该组件可以调用的微信API是有限的。 例如,无法调用wx.login()来获取用户信息。 具体限制是:
代码写完后,注意/.json文件中的配置:
{
"publicComponents": {
"hgPlayer": "components/player/player"
},
"main": "index.js"
}
表示使用该插件的小程序可以使用该组件。 该组件对应的代码为“//”
配置好后,我就可以将插件代码上传到腾讯服务器,进入微信小程序开发后台提交审核了。 腾讯审核通过后,第三方小程序就可以使用我们编写的插件了。
如何使用第三方插件
使用第三方插件之前,需要进入微信小程序开发后台,将插件添加到第三方服务中:


填写第三方插件的AppId,点击添加按钮,对方账号的小程序插件 > 应用管理中就会出现你的应用,如下图:

需要第三方同意您的申请后,您就可以开始使用第三方插件了。
使用第三方插件时,我们需要配置自己小程序的app.json,如下:
{
"pages": [
"pages/index/index"
],
"plugins": {
"myPlugin": {
"version": "dev",
"provider": "填写申请通过的插件AppId"
},
"plugin1": {
"version": "dev",
"provider": "填写申请通过的插件AppId"
},
"plugin2": {
"version": "dev",
"provider": "填写申请通过的插件AppId"
}
...
}
}
:要使用的已配置第三方插件列表。
配置完插件列表后,由于每个插件可能有多个组件,所以我们需要定义每个页面要使用的组件。 例如,要在index.js中使用该组件,需要在index.json中进行如下配置:
{
"usingComponents": {
"player": "plugin://myPlugin/hgPlayer"
}
}
“”:“:///”的含义是:使用本页面的插件组件,本页面的别名是: 。
配置好index.json后,可以直接在index.wxml中使用,例如:
跟进
到目前为止微信小程序开发免费视频教程,我们已经介绍了:
这个怎么样? 小程序的开发和使用够简单吗? 你能完全理解并上手吗? 你还有别的问题吗? 欢迎留言与我交流。
”
海哥是一位IT科学家、技术架构师、开源爱好者。 他的开源软件:Jboot被评选为开源中文社区“*受欢迎的开源中文软件”。 我喜欢科技产品,研究新技术。 我擅长将晦涩的技术简单化并愿意分享。