使用插件添加插件
使用插件前,必须先在小程序管理后台的“设置-第三方服务-插件管理”中添加插件。 开发者可以登录小程序管理后台,通过appid查找和添加插件。 如果插件不需要申请,添加后可以直接使用; 否则需要申请并等待插件开发者审核通过后才能在小程序中使用对应的插件。
导入插件代码包
用户在使用插件前,需要在app.json中声明要使用的插件,例如:
代码示例:
{
"plugins": {
"myPlugin": {
"version": "1.0.0",
"provider": "wxidxxxxxxxxxxxxxxxx"
}
}
}
如上例所示,plugins定义部分可以包含多个plugin声明,每个plugin声明由一个用户定义的plugin reference name标识,并指定要使用的plugin的appid和version number。 其中,引用名称(如上例中的myPlugin)由用户自行定义,无需与插件开发者保持一致或协调。 在后续使用插件时,将使用引用名称来表示插件。
在分包中引入插件代码包
如果插件只在一个子包中使用,可以将插件只放在这个子包中,例如:
{
"subpackages": [
{
"root": "packageA",
"pages": [
"pages/cat",
"pages/dog"
],
"plugins": {
"myPlugin": {
"version": "1.0.0",
"provider": "wxidxxxxxxxxxxxxxxxx"
}
}
}
]
}
在分包中使用插件有以下限制:
使用插件
使用插件时,插件的代码对用户是不可见的。 为正确使用插件,用户应查看插件详情页的“开发文档”部分,阅读插件开发者提供的插件开发文档,使用文档明确自定义插件提供的组件、页面名称、js接口提供规范等。
自定义组件
使用插件提供的自定义组件与使用普通自定义组件类似。 在json文件中定义需要引入的自定义组件时,使用plugin://协议指明插件的引用名和自定义组件的名称,例如:
代码示例:
{
"usingComponents": {
"hello-component": "plugin://myPlugin/hello-component"
}
}
为了插件的保护,插件提供的自定义组件在使用上有一定的限制:
wx.createSelectorQuery等接口的>>>选择器不能在plugin.page内部选择
从小程序基础库版本 2.1.0 开始支持插件页面。
当需要跳转到插件页面时,在url中使用plugin://前缀,如plugin://PLUGIN_NAME/PLUGIN_PAGE,如:
代码示例:
<navigator url="plugin://myPlugin/hello-page">
Go to pages/hello-page!
navigator>
js界面
使用插件的js接口时,可以使用requirePlugin方法。 例如,一个插件提供了一个名为 hello 的方法和一个名为 world 的变量插件迷,可以这样调用:
var myPluginInterface = requirePlugin('myPlugin');
myPluginInterface.hello();
var myWorld = myPluginInterface.world;
从基础库2.14.0开始,也可以通过插件的AppID获取接口,如:
var myPluginInterface = requirePlugin('wxidxxxxxxxxxxxxxxxx');
导出到插件
在开发者工具中预览效果需要在miniprogram/app.json中手动填写插件AppID
从2.11.1基础库开始,使用插件的小程序可以导出部分内容供插件获取。 具体来说,在声明使用插件时,可以通过export字段指定一个文件,如:
{
"myPlugin": {
"version": "1.0.0",
"provider": "wxidxxxxxxxxxxxxxxxx",
"export": "index.js"
}
}
那么这个文件(上例中的index.js)导出的内容就可以通过这个插件的全局函数来获取了。 例如,在上面的文件中,使用插件的小程序执行以下导出:
// index.js
module.exports = { whoami: 'Wechat MiniProgram' }
然后插件就可以获取上面导出的内容了:
// plugin
requireMiniProgram().whoami // 'Wechat MiniProgram'
具体导出内容可阅读插件开发文档,并与插件开发者约定。
当插件在子包中时,此功能也有效,但指定文件的路径是相对于子包的。 例如在root:packageA的子包中指定了export:exports/plugin.js,那么指定的文件应该是文件系统上的/packageA/exports/plugin.js。
使用的多个插件的导出互不影响。 两个插件可以导出相同的文件或不同的文件。 但在导出同一个文件时,如果一个插件修改了导出的内容,其他插件也会受到影响,请注意这一点。
请谨慎导出 wx 对象或特定的 wx API,这将允许插件调用 API 作为消费者小程序。
或者
为插件提供自定义组件
在开发者工具中预览效果需要在miniprogram/app.json中手动填写插件AppID
有时,插件可能会将页面或自定义组件的一部分交给使用的小程序进行渲染,因此使用的小程序需要提供自定义组件。 但是由于插件无法直接指定小程序的自定义组件路径,需要通过为插件指定一个抽象节点(generics)来提供。
如果插件的自定义组件需要指定抽象节点实现,可以在引用时指定:
<plugin-view generic:mp-view="comp-from-miniprogram" />
从基础库2.12.2开始插件迷,可以通过配置项为插件页面指定抽象组件实现。 比如你想指定小程序的自定义组件components/comp-from-miniprogram作为plugin-index页面中抽象节点mp-view的实现:
{
"myPlugin": {
"provider": "wxAPPID",
"version": "1.0.0",
"genericsImplementation": {
"plugin-index": {
"mp-view": "components/comp-from-miniprogram"
}
}
}
}
或者