一直有需求，想做uniapp开发的宿主app的小程序，但是，官网上没有找到相关的文档，但官方确实也有提供该功能，功能不是十分完善，但是也几乎足够用了。当时找相关文档很辛苦，以下是官方大哥提供给的各api的相关文档介绍，为了大家不至于很难找，现整理下贴出来。

用法其实十分简单，在Hbuilder x中，目前已经集成了相关api，直接调用即可(配置后需提交云端打包后才能⽣效，真机运⾏时推荐使⽤⾃定义调试基座)。

关于宿主app使用的api

宿主App是通过uniMP模块管理uni⼩程序，云端打包时需要在宿主App项⽬的manifest.json中配置使⽤uni⼩

程序模块。 在"app-plus"->"modules"节点下添加"UniMP"模块，示例如下：

 "app-plus" : {  
     "modules" : {  
         "UniMP": {  
             "description": "uni⼩程序"  
         }  
     },  
 //...  
 }

加载uniMP模块

在调⽤uni⼩程序API时需先调⽤uni.requireNativePlugin⽅法加载uni⼩程序管理模块。如果返回的mp为undefined，说明当前环境不⽀持uni⼩程序

示例如下：

const mp = uni.requireNativePlugin('uniMP');  
//通过mp可调⽤⽅法操作uni⼩程序  
mp.openUniMP({  

 appid:'⼩程序的appid'  

});

installUniMP(options,callback)

通过wgt安装uni⼩程序到宿主App中，示例如下：

mp.installUniMP({  

 appid: 'uni⼩程序的appid',  

 wgtFile: 'uni⼩程序的wgt⽂件路径'  

}, (ret)=>{  

 console.log('installUniMP: ' JSON.stringify(ret));  

});

options参数说明

JSON Object类型

callback回调参数说明

JSON Object类型

openUniMP(options,callback)

打开uni⼩程序，示例如下：

mp.openUniMP({  

 appid: 'uni⼩程序的appid'  

}, (ret)=>{  

 console.log('openUniMP: ' JSON.stringify(ret));  

});

options参数说明

JSON Object类型

callback回调参数说明

JSON Object类型

closeUniMP(appid,callback)

关闭已经运⾏的uni⼩程序，示例如下：

mp.closeUniMP('uni⼩程序的appid', (ret)=>{  

 console.log('closeUniMP: ' JSON.stringify(ret));  

 });

参数说明

callback回调参数说明

JSON Object类型

hideUniMP(appid,callback)

隐藏运⾏在前台的uni⼩程序，示例如下：

mp.hideUniMP('uni⼩程序的appid', (ret)=>{  

 console.log('hideUniMP: ' JSON.stringify(ret));  

});

参数说明

callback回调参数说明

showUniMP(appid,callback)

将运⾏在后台的uni⼩程序切换到前台显示，示例如下：

mp.showUniMP('uni⼩程序的appid', (ret)=>{  

 console.log('showUniMP: ' JSON.stringify(ret));  

});

参数说明

callback回调参数说明

JSON Object类型

getUniMPVersion(appid,callback)

获取安装的uni⼩程序版本信息，示例如下：

mp.getUniMPVersion('uni⼩程序的appid', (ret)=>{  

 console.log('getUniMPVersion: ' JSON.stringify(ret));  

});

参数说明

callback回调参数说明

JSON Object类型

versionInfo参数说明

onUniMPEventReceive(callback)

监听uni⼩程序发送的event事件，建议在宿主App的应⽤⽣命周期onLaunch中进⾏监听。在uni⼩程序中调

⽤uni.sendHostEvent发送event事件后触发。

示例如下：

export default {  
 onLaunch: function() {  
 console.log('Host App Launch');  

 //监听uni⼩程序发送的事件  
 mp.onUniMPEventReceive(ret=>{  
console.log('Receive event from MP: ' JSON.stringify(ret));  
 });  
 },  
 //...  
}

callback回调参数说明

JSON Object类型

sendUniMPEvent(appid,event,data,callback)

注：uni⼩程序必须处于运⾏状态，否则会发送失败

宿主App向uni⼩程序发送event事件，在uni⼩程序中调⽤uni.onHostEventReceive监听。

示例如下：

mp.sendUniMPEvent('uni⼩程序的appid', 'event事件名称', '要传递的数据', (ret) =>  
{  
 //发送消息成功回调  

 console.log('Send event to MP: ' JSON.stringify(ret));  

});

参数说明

setDefaultMenuItems(options,callback)

设置胶囊按钮菜单 ActionSheet 项

示例如下：

mp.setDefaultMenuItems({  
    items: [{  
        title: "关于",  
        id: "about"  
    }, {  
        title: "分享",  
        id: "share"  
    }]  
    }, ret => {  
        if (ret.id == "about") {  
        console.log("点击了 关于")  
    }  
})

参数说明

options 参数说明

actionSheetItem 参数说明

callback回调参数说明

**

uni⼩程序使⽤的API

获取启动参数

宿主App启动uni⼩程序传⼊的extraData参数可在⼩程序项⽬App.vue的应⽤⽣命周期onLaunch、onShow中

获取，

示例如下：

//⾸次启动  
onLaunch: function(info) {  
    console.log('App Launch:',info);  
}  
//从后台切换到前台  
onShow: function(info) {  
    console.log('App Launch:',info);  
}

info参数说明

uni.sendHostEvent(event,data,ret,callback)

uni⼩程序向宿主App发送event事件，在宿主App中可调⽤onUniMPEventReceive监听接收event事件。

示例如下：

uni.sendHostEvent(event, data, (ret) => {  
 //发送消息成功回调  
 console.log('Send event to Host: ' JSON.stringify(ret));  

});

参数说明

callback回调参数说明

uni.onHostEventReceive(callback)

uni⼩程序监听宿主App发送的event事件，建议在uni⼩程序应⽤⽣命周期onLaunch中监听。在uni宿主App

中调⽤sendUniMPEvent发送event事件后触发。

示例如下：

export default {  
 onLaunch: function() {  
 console.log('App Launch');  

 //监听宿主App通讯数据  
 uni.onHostEventReceive((event,data)=>{  
console.log('Receive event(' event ') from HOST:  
' JSON.stringify(data));  
 });  
 },  
 //...  
}

callback回调参数说明

如何打包小程序

选中需要打包的项目

发行-原生APP制作应用wgt包，确定即可。

将wgt包防止到宿主项目中，mp.installUniMP中，wgtFile直接引用(以下是放到static文件夹下的applet文件夹示例)

mp.installUniMP({  
        appid: this.TRAIN_APPLET_APPID,  
        wgtFile: '/static/applet/ceshi.wgt',  
    },