当前位置: 代码网 > it编程>编程语言>Javascript > uniapp  微信跳转至半屏的使用示例

uniapp  微信跳转至半屏的使用示例

2024年09月06日 Javascript 我要评论
微信小程序之间的半屏跳转 - uni.openembeddedminiprogram(object)点击uniapp跳转半屏使用的文档说明在uniapp的开发项目中,开发者需要在全局配置manifes

微信小程序之间的半屏跳转 - uni.openembeddedminiprogram(object)

点击uniapp跳转半屏使用的文档说明

在uniapp的开发项目中,开发者需要在全局配置manifest.json–>mp-weixin节点下添加embeddedappidlist字段并声明需要半屏跳转的小程序,若不配置将切换为普通的小程序跳转小程序;(半屏的兼容性,如果不符合条件则自动转换为全屏的形式跳转)
配置示例:

// manifest.json
{
		"mp-weixin" : {
		   "embeddedappidlist": ["wxe5f52902cf4de896"]//需要半屏跳转的小程序appid
		}
	}

而在代码中的使用示例:

uni.openembeddedminiprogram({
	appid: '',
	path: 'pages/index/index?id=123',
	extradata: {
		'data1': 'test'
	},
	success(res) {
    // 打开成功
	}
})

使用限制

使用过程有以下限制,若不符合以下所有条件将被自动切换为普通的(全屏)小程序跳转小程序,不影响用户使用:

  • 被半屏跳转的小程序需要通过来源小程序的调用申请,开发者可在 小程序管理后台「设置」-「第三方设置」-「半屏小程序管理」板块发起申请,最多可以申请10个小程序
  • 3.1版本以下基础库,被半屏打开的小程序需要在app.json的embeddedappidlist字段中声明;
  • 当前小程序需为竖屏;
  • 被半屏跳转的小程序需为非个人主体小程序(不含小游戏)。

在后台的配置:
点击进入小程序管理后台的登录

在以上的配置中,即可使用跳转半屏api的调用;
在此基础上也可封装一个方法的使用,在api可调用,但配置未完成的情况下,调用openembeddedminiprogram的半屏的不生效,并自动转换为全屏的形式;

注:半屏跳转必须是事件的@tap/@click的跳转,不能是模态框(uni.showmodal的确认/取消事件)的点击事件调用,模态框的事件调用半屏则默认是全屏的跳转

// method.js
export function openembeddedminiprogram(data) {
    let openminiprogram = wx.navigatetominiprogram;
     // caniuse检查openembeddedminiprogram在此场景是否可用
    if (uni.caniuse('openembeddedminiprogram')) {
        openminiprogram = wx.openembeddedminiprogram;
    }
    openminiprogram(data);
}
// main.js
import vue from 'vue';
import { openembeddedminiprogram } from './method.js';
vue.prototype.$openembeddedminiprogram = openembeddedminiprogram;
// 调用的事件
this.$openembeddedminiprogram({
    appid: '需要跳转小程序的appid',
    path: '需要跳转小程序的指定路径/'
});

官方的呈现效果

到此这篇关于uniapp - 微信跳转至半屏的使用的文章就介绍到这了,更多相关uniapp微信半屏跳转内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!

(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2025  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com