iis服务器助手广告广告
返回顶部
首页 > 资讯 > 移动开发 >小程序中半屏打开其他小程序,开发者工具调试半屏
  • 953
分享到

小程序中半屏打开其他小程序,开发者工具调试半屏

小程序 2023-09-06 22:09:10 953人浏览 薄情痞子
摘要

前言:         有需要是在当前小程序中,点击操作时,如果他没有注册会员,则强制去另一个小程序去注册会员,注册成功在返回,在这期间,打开另一个小程序是半屏来展示的。 实现效果:         在a小程序中半屏展示b小程序,半屏上

前言:

        有需要是在当前小程序中,点击操作时,如果他没有注册会员,则强制去另一个小程序去注册会员,注册成功在返回,在这期间,打开另一个小程序是半屏来展示的。

实现效果:

        在a小程序中半屏展示b小程序,半屏上方展示b小程序信息,打开的vconsole还有底部分享等都是b小程序的内容

实现步骤:

1、微信公众号平台中配置两个小程序的  appid

设置--》第三方设置--》半屏小程序管理     添加你的双方小程序

 2、a小程序中 app.JSON 中添加

        2.23.1以下版本基础库开发者需要在全局配置app.jsonembeddedAppIdList字段中声明需要半屏跳转的小程序,若不配置将切换为普通的小程序跳转小程序。2.23.1及以上版本起无需配置

"embeddedAppIdList": ["wx5e7f6f2293842***", "wxfc028f6cd8075***"],

 3、b小程序中 app.json 配置同a小程序,跳转方法:

wx.openEmbeddedMiniProgram({    // 要跳转的小程序的appid    appId: 'wxfc028f6cd8075***',    path: `/pages/index/index?scene=inviteCode%3D1668147166040371201`,    success: () => {},    fail: (error) => {        console.log('跳转小程序失败', error)    },    complete: () => {   }})

4、官方提供的其他功能

半屏小程序环境判断

        开发者可以通过调用 wx.getEnterOptionsSync 读取 apiCategory 参数,当值为embedded时,可以判断此时小程序被半屏打开。

返回原小程序

        被半屏打开的小程序可以以通过调用 wx.navigateBackMiniProgram 返回上一个小程序。

开发者工具调试半屏效果方法:

1、点击开发者工具的  普通编译,如果新项目没有,新建一个

 2、打开小程序模块,可以看到有多种半屏可以选择

 3、选择最下面的 就是我们半屏的效果了,半屏类原生是我们项目中加的半屏弹框

 

半屏打开的b小程序的注意事项:

  • b小程序必须做到,使用所有的单位都是响应式的 rpx,  vh等等,如果有px  以及  calc  计算出来的px  会导致高度出现异常
  • b 小程序半屏的比例是:   665/812  

官方api:

打开半屏小程序 | 微信开放文档微信开发者平台文档https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/openEmbeddedMiniProgram.html

来源地址:https://blog.csdn.net/qq_41619796/article/details/131187591

--结束END--

本文标题: 小程序中半屏打开其他小程序,开发者工具调试半屏

本文链接: https://www.lsjlt.com/news/397636.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 小程序中半屏打开其他小程序,开发者工具调试半屏
    前言:         有需要是在当前小程序中,点击操作时,如果他没有注册会员,则强制去另一个小程序去注册会员,注册成功在返回,在这期间,打开另一个小程序是半屏来展示的。 实现效果:         在a小程序中半屏展示b小程序,半屏上...
    99+
    2023-09-06
    小程序
  • 微信小程序开发介绍微信开发者工具以及小程序框架
    小编给大家分享一下微信小程序开发介绍微信开发者工具以及小程序框架,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!(一)微信开发者工具小程序团队推出了自己的开发工具-...
    99+
    2023-06-14
  • 小程序extAppid怎么开发调试
    这篇文章主要介绍“小程序extAppid怎么开发调试”,在日常操作中,相信很多人在小程序extAppid怎么开发调试问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”小程序extAppid怎么开发调试”的疑惑有所...
    99+
    2023-06-26
  • uniapp小程序console.log在微信开发者工具中不打印问题
    最近在开发一款uniapp小程序,发现console.log在微信开发者工具中不打印,但在H5页面就能够有打印输出,于是在网上寻找原因… 主要是由于vue.config.js文件中有设置发布时删除co...
    99+
    2023-09-16
    uni-app 小程序 vue.js
  • 小程序中头脑王者辅助工具如何开发
    这篇“小程序中头脑王者辅助工具如何开发”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“小程序中头脑王者辅助工具如何开发”文章吧...
    99+
    2023-06-26
  • 微信小程序开发工具介绍
    目录官方文档一、微信开发工具深入介绍下载开发工具1.1 大体介绍开发工具主要分四大块1.2 工具栏1.3编辑器1.4调试器编辑器总结官方文档 https://developers.w...
    99+
    2024-04-02
  • vscode开发小程序项目并在微信开发者工具运行
    需求:vscode开发uniapp之后在微信开发者工具运行,更改的时候微信开发者也同步更改 创建微信小程序所需插件,在vscode的插件管理里面安装就可以了 微信小程序开发工具 vscode weapp api vscode wxml vs...
    99+
    2023-09-01
    vscode 小程序 ide
  • 微信小程序API如何打开调试
    这篇“微信小程序API如何打开调试”文章,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要参考一下,对于“微信小程序API如何打开调试”,小编整理了以下知识点,请大家跟着小编的步伐一步一步的慢慢理解,接下来就让我们进入...
    99+
    2023-06-26
  • 微信小程序是什么工具开发
    微信小程序的开发工具:1、微信开发者工具,微信官方提供的一款开发工具,是开发微信小程序的首选工具;2、IDE工具,可以使用各种集成开发境工具,例如Visual Studio Code和Sublime Text和Atom等;3、第三方开发框架...
    99+
    2023-08-16
  • 小程序-真机上接口无法调通,开发者工具上可以
    近期在对接小程序,在这里记录一下,我们在对接小程序的时候碰到的一些奇奇怪怪的问题。 其中一个问题如下: 真实效果如下图 开发者工具上可以,访问没有人任何问题。 真机上接口无法调通,也没有报错,也没有返回值。 解决办法一: 检查自己的小程序...
    99+
    2023-08-31
    小程序
  • 微信小程序中如何安装开发工具
    这篇文章主要为大家展示了“微信小程序中如何安装开发工具”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“微信小程序中如何安装开发工具”这篇文章吧。小程序账号申请成功之后的工作就是准备开发环境。微信小...
    99+
    2023-06-19
  • 小程序开发制作工具怎么下载
    小程序开发制作工具的下载方法:1.打开微信公众平台官网;2.选择开发者工具;3.点击“下载”链接;4.选择对应操作系统安装包;5.下载并安装即可。具体操作步骤:首先需要打开一个浏览器,搜索“微信公众平台”。进入“微信公众平台”官网后,点击页...
    99+
    2024-04-02
  • 小程序的前端开发工具有哪些
    小程序的前端开发工具主要有以下几种: 微信开发者工具:官方提供的一款用于小程序开发的IDE,集成了代码编辑器、调试器、预览等功能...
    99+
    2024-04-17
    小程序
  • 微信小程序开发工具实例分析
    这篇文章主要讲解了“微信小程序开发工具实例分析”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“微信小程序开发工具实例分析”吧!一、微信开发工具深入介绍在讲编辑器之前,我要强调一下,这个一点都不...
    99+
    2023-06-30
  • 解析从小程序开发者工具源码看原理实现
    目录如何查看小程序开发者工具源码小程序架构设计1、小程序渲染是在同一个线程吗?双线程机制2、小程序是web渲染吗?界面渲染机制3、小程序是用web的html标签渲染吗?Exparse...
    99+
    2024-04-02
  • 移动互联网下半场小程序打开产业互联网时代
    1 | 小程序时代2016年9月21日,微信向开发者发起小程序的内测邀请。2017 年 1 月 9 日,微信小程序正式上线。不过,初生的小程序相当低调,并没有受到广泛的关注。那时,没人想到移动互联网的绝对流量之王微信又开启了一个新的时代——...
    99+
    2023-06-05
  • 微信小程序是什么,用什么工具开发?
    ...
    99+
    2024-04-02
  • 小程序开发中如何打开地图选择位置
    这篇“小程序开发中如何打开地图选择位置”除了程序员外大部分人都不太理解,今天小编为了让大家更加理解“小程序开发中如何打开地图选择位置”,给大家总结了以下内容,具有一定借鉴价值,内容详细步骤清晰,细节处理妥当,希望大家通过这篇文章有所收获,下...
    99+
    2023-06-26
  • 小程序 - Taro小程序中打开h5页面链接 - 并解决:无法打开该页面 - 不支持打开 https://www.baidu.com/,请在“小程序右上角更多->反馈与投诉”中和开发者反馈
    目录 业务需求解决方案实现1. 使用 WebView 组件创建浏览h5的页面2. `app.js` 中配置h5页面路径3. 实现跳转4. 遇到的问题 业务需求 Taro 小程序中h...
    99+
    2023-09-25
    taro 小程序
  • 小程序开发工具基础库更新了哪些内容
    本篇内容主要讲解“小程序开发工具基础库更新了哪些内容”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“小程序开发工具基础库更新了哪些内容”吧!最新版本 2017.03.29 (0.15.152900...
    99+
    2023-06-26
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作