.

H5跳转小程序功能(专业版及其以上版本用户)

小常发表于:2020年12月10日 15:32:41更新于:2021年11月26日 17:23:11

H5跳转小程序正式上线啦,赶快看下效果吧!

0015fda1fa71826fcc6884f758a0343

您需要获取小程序原始AppID小程序路径才能使用该功能!

注意:必须是原始ID,ID格式为gh_开头的,微信官方文档:开放标签说明文档


如何获取小程序原始AppID?

1、在需要跳转的小程序平台:https://mp.weixin.qq.com

0015fdaca78ad39ecf27cd87cb3dd20

注意用小程序管理员账号登陆小程序管理后台

image.png


在页面最下方找到设置

image.png


进入设置页面后,点击基本设置,滚动页面至最底部。

image.png

来到设置——基本设置——页面底部,找到最底部的原始ID,gh_开头的,复制好备用。

image.png


如何获取小程序路径?

1.下载微信开发者工具登录自己的小程序后台。

2.在小程序开发界面上找到要跳转至的路径,如下图是:page/index/index.wxml

image.png


如何使用跳转小程序组件?

拿到小程序原始ID和路径后,来到编辑器界面。

在编辑器中找到该组件——跳转小程序,该组件为按钮,只能通过点击的方式跳转至小程序。

image.png


4.添加跳转小程序的按钮后,是一个文字按钮的样式。将原始ID和路径填写到右侧面板中。

关于路径:有的是以.html结尾的,也有的是以.wxml结尾的。如pages/index/index.html;

还需注意page和pages的区别,有时路径错误可能是page后面多加了一个S或者pages少了S,大家在调试的时候注意该问题。

注:如需在跳转小程序时带上自己的参数,可以参考以下格式设定小程序路径:

pages/detail/detail.html?shopStyle=multipic&shopUuid=H4DhaOKB28gzOlkZ&from=list&shopType=10

image.png

附件:H5跳转小程序.mp4 • 14.76MB • 下载