6
微信内h5页面打开小程序
source link: http://www.fly63.com/article/detial/10596
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
时间: 2021-07-30阅读: 24标签: 小程序分享
扫一扫分享
微信js文件版本大于等于1.6.0
https://res.wx.qq.com/open/js/jweixin-1.6.0.js
微信授权配置
window.wx.config({
...otherConfig,
openTagList: ['wx-open-launch-weapp']
})const style = {
position: 'absolute',
top: 0,
right: 0,
bottom: 0,
left: 0,
};
function OpenWeapp({ originId, pagePath }) {
return (
<wx-open-launch-weapp username={originId} path={pagePath} style={style}>
<script type="text/wxtag-template">
<div style={style} />
</script>
</wx-open-launch-weapp>
);
}
// 使用方式
<div style={{ position: 'relative' }}>
点击跳转小程序
<OpenWeapp originId="gh_xxxxxxxx" pagePath="pages/home/index?user=123&action=abc" />
</div>
为什么给div添加position: relative呢？
由于wx-open-launch-weapp设置样式比较困难，故放弃设置样式，将wx-open-launch-weapp作为一个透明的占位元素，撑满父元素，也能达到预期的功能
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK