微信半屏小程序的实现

微信小程序新出的 API，可以以半屏的形式，打开另一个小程序。
这种方式和之前的跳转小程序方式相比，优势是：

• 不用弹框了，减少用户操作
• 有主次解构，适合打开一些工具型的小程序。

那么如何使用呢？

实践

首页要在小程序后台配置：
设置 -> 第三方设置 -> 半屏小程序管理
点击添加输入另一个小程序的 appid 发送申请，另一个小程序管理员通过后这边状态会显示已通过，如图：

然后我们开始代码中调用，我这里简单封装了一个函数：

export const openHalfMini = () => {
  const platform = wx.getSystemInfoSync().platform
  if (platform !== 'android') {
    wx.showLoading({
      title: '打开小程序中',
      mask: true
    })
  }
  const token = wx.getStorageSync('token')
  wx.openEmbeddedMiniProgram({
  	// 要跳转的小程序的appid
    appId: 'wxcfxxxx',
    envVersion: __ENV__ !== 'production' ? 'trial' : 'release',
    path: `/pages/index/index?id=xxx`,
    success: () => {},
    fail: (error) => {
      console.log('跳转小程序失败', error)
    },
    complete: () => {
      wx.hideLoading()
    }
  })
}

• 为什么加了 loading？
  因为打开这个 api 会有一些延时，比如点击触发后1s左右才能打开另一个小程序。
• 为什么 android 下我没有加 loading？
  因为 android 触发这个 api 的时候系统自己有 loading，我加了会重复。

都是实践出来的坑啊~

对了，还有一个坑，有些手机会唤起失败，直接唤起了全屏的小程序，所以我们为了兼容，要在 app.json 中加上：

{
  "embeddedAppIdList": ["wxxxxxxxx"]
}

这里的 appid 是你要跳转到的小程序的 appid。

传给另一个小程序的参数，可以在另一个小程序接收（具体看文档），我是在另一个小程序做了一个通用页面来接收的。