版本要求
打开微信小程序开放标签
wx-open-launch-weapp
开放对象
已认证的服务号,服务号绑定“JS接口安全域名”下的网页可使用此标签跳转任意合法合规的小程序。
已认证的非个人主体的小程序,使用小程序云开发的静态网站托管绑定的域名下的网页,可以使用此标签跳转任意合法合规的小程序。
使用说明
所有开放标签都能像普通的HTML标签一样在页面中直接使用,不需要再进行额外的处理。
如果所使用的标签允许提供插槽,由于插槽中模版的样式是和页面隔离的,因此需要注意在插槽中定义模版的样式。插槽模版及样式均需要通过进行包裹。另外,对于具名插槽还需要通过slot属性声明插槽名称,下文标签插槽中的default插槽为默认插槽,可不声明插槽名称。
对于标签事件,均可通过event.detail获得详细信息。如果无特殊说明,下文标签事件说明中的返回值均指代event.detail中的内容。
相关参数配置
属性
名称 | 必填 | 备注 |
---|---|---|
username | 是 | 所需跳转的小程序原始id,即小程序对应的以gh_开头的id |
path | 否 | 所需跳转的小程序内页面路径及参数 |
插槽
名称 | 必填 | 备注 |
---|---|---|
default | 是 | 跳转按钮模版及样式 |
<wx-open-launch-weapp id="launch-btn" username="gh_ce3adf9da091" path="pages/index/index"></wx-open-launch-weapp>
如果在Vue项目里使用,因为 wx-open-launch-weapp 标签不被vue识别
须使 Vue 忽略在 Vue 之外的自定义元素 (e.g. 使用了 Web Components APIs)。否则,它会假设你忘记注册全局组件或者拼错了组件名称,从而抛出一个关于 Unknown custom element 的警告。
需在main.js里增加以下代码配置(忽略此标签)
Vue.config.ignoredElements = [‘wx-open-launch-weapp’]
完整代码demo可关注微信公众号
回复【H5跳转小程序-jq】获取Jquery版demo
回复【H5跳转小程序-vue】获取Vue版demo
如果觉得有用随手点个赞吧,谢谢
关注我,不定时分享技术干货~