UniAppJSBridgeReady不触发

最新推荐文章于 2023-07-10 09:58:38 发布

weixin_47072581

最新推荐文章于 2023-07-10 09:58:38 发布

阅读量1.5k

点赞数

文章标签： html5 vue.js 前端

本文链接：https://blog.csdn.net/weixin_47072581/article/details/131422638

版权

背景：uniapp开发的小程序（简称UNI）页面A用Webview内嵌vue开发的h5，想从h5直接跳到UNI页面B。

UNI页面A

<template>
	<view>
		<web-view :src="sesbkUrl"></web-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				sesbkUrl: ''
			}
		},
		onLoad(options) {
            this.sesbkUrl = 'https:/xxxxxxxxxx.cn/aaa/#/?token=' + token + '&openid=' + openid 
		},
	}
</script>

h5页面(vue)

index.html

<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title></title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>

<body>
    <div id="app"></div>
    <!--微信sdk-->
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>

    <!-- uni-app sdk-->
    <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
</body>

</html>

注意：

1、微信sdk要写在uni-app sdk前面

2、两个script要写在body里面！（我的UniAppJSBridgeReady没有触发就是因为之前没有写在body里面）

h5业务页面（实际使用的页面）

mounted() {
        this.$nextTick(() => {
            // 初始化uni.webview
            document.addEventListener("UniAppJSBridgeReady", function () {
                console.log("初始化uniapp的API成功");
            });
        });
    },

methods: {
    toPage() {
         uni.redirectTo({
             url: "/pages/face/face?bizToken=" + this.bizToken + "&id=" + this.id
         });
     }
}

备注：初始化成功后，后续可以直接使用。（如果初始化未成功，会报uni undefined）

weixin_47072581

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
UniAppJSBridgeReady不触发

背景：uniapp开发的小程序（简称UNI）页面A用Webview内嵌vue开发的h5，想从h5直接跳到UNI页面B。备注：初始化成功后，后续可以直接使用。（如果初始化未成功，会报uni undefined）（我的UniAppJSBridgeReady没有触发就是因为之前没有写在body里面）1、微信sdk要写在uni-app sdk前面。2、两个script要写在body里面！h5业务页面（实际使用的页面）
复制链接

扫一扫