h5跳转小程序你可能遇到的问题 - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

h5跳转小程序你可能遇到的问题

发表时间:2021-1-5

发布人:葵宇科技

浏览次数:52

微信开放标签


微信开放标签相信大家都很熟悉,是微信公众平台面向网页开发者提供的扩展标签集合。 通过使用微信开放标签,网页开发者可安全便捷地使用微信或系统的能力,为微信用户提供更优质的网页体验 。此文档面向网页开发者,介绍微信开放标签如何使用及相关注意事项。 需要注意的是,微信开放标签有最低的微信版本要求,一定要注意版本哦! #微信版本要求为:7.0.12及以上。 系统版本要求为:iOS 10.3及以上、Android 5.0及以上。


< wx-open-launch-weapp> 标签到底怎么用

第一步:

第二步

在公众号设置里面找到功能设置里面填写你的域名,如果你的项目没有下载过文档上的文件,那么下载它放在你域名的根目录下面就可以了
复制代码

第三步:

在你的项目中引入wx的js res.wx.qq.com/open/js/jwe… 此处第一个坑来了,在安卓和ios上不同的是。如果你的页面启用了https,那么你在必须引入res.wx.qq.com/open/js/jwe… 否则会在ios9.0以上系统中成功使用jssdk。 接下来你需要后端配合你配置一些wx.config需要的参数,直接上代码

此处有个注意!!配置的是wx-open-launch-weapp,要跳转APP是wx-open-launch-app,别踩坑。

第四步 先看一下官方的代码

此处踩雷是我踩的最多的!

首先template标签,在这里肯定是不好用的,所以我们先来了解一下HTML5的,template标签看完这里,我们应该想到我们项目用到的是React,react是通过扩展语言jsx来书写Html页面的,
也是通过babel转译成普通js代码来让浏览器识别的。jsx渲染大家都知道特使通过大小写的方式来识别组件和正常标签的,
所以template标签会被转化为原生元素,浏览器是没有这个原生元素的,所以就产生了问题。
复制代码

接下来我们在看一下官方文档

虽然说得是vue,但是我感觉react也是一样的。所以接下看在看代码

这里注意一下script标签,script内部创建的标签的样式和外面完全隔离,没有一丝关系,所以只能用行内方式style的方式添加样式,className不可以。


结束


基本上上述描述应该可以满足大家的开发需求,也是记一次自己走过的路。测试的时候还是很麻烦的,因为只能跳转线上小程序,但愿上线的是没有问题。


相关案例查看更多