web-view 是一个 web 浏览器组件，可以用来承载网页的容器，会自动铺满整个页面
-
srcwebview 指向网页的链接(小程序仅支持加载网络网页) - 小程序端
web-view组件一定有原生导航栏，下面一定是全屏的web-view组件，所以不支持其他组件
<template>
<view>
<web-view src="https://uniapp.dcloud.io/static/web-view.html"></web-view>
</view>
</template>
web-view 加载的网页中支持调用部分 uni 接口：
| 方法名 | 说明 | 平台差异说明 |
|---|---|---|
| uni.navigateTo | ||
| uni.redirectTo | ||
| uni.reLaunch | ||
| uni.switchTab | ||
| uni.navigateBack | ||
| uni.postMessage | 向应用发送消息 | 字节跳动小程序不支持、H5 暂不支持（可以直接使用 window.postMessage |
| uni.getEnv | 获取当前环境 | 字节跳动小程序不支持 |
-
uni.webview.js最新版地址：https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js
需将uni.webview.jsuni对象替换成一个别的对象
下载UNI-SDK: https://pan.baidu.com/s/1NyfYwZvmIaADV_jxkwPGzQ 提取码: t5h9
(里面引入了微信小程序的JS_SDK，可以使用uni对象操作如上uni接口)
- 微信小程序JS-SDK https://res.wx.qq.com/open/js/jweixin-1.4.0.js
引入会报TypeError: Cannot read properties of undefined (reading 'title')
把jweixin-1.4.0.js里的this替换成window即可
下载JS-SDK: https://pan.baidu.com/s/1aSSpbLGwAXNQFRX47BV6Pg 提取码: nmpv
Html页面
<template>
<view>
<view class="login" @click="clickLogin">跳转uni-plus登录页面{{des}}</view>
</view>
</template>
<script>
// // 引入 uni 的 SDK(修改版 支持微信小程序的js-sdk)
import uniWebView from '@/common/uni.webview.js';
export default {
data() {
return {
des: ""
}
},
methods: {
clickLogin() {
this.des = "（响应@Click的登录）"
}
},
onLoad() {
// 待触发 `UniAppJSBridgeReady` 事件后，即可调用 uni 的 API。
// 不触发就用@click
document.addEventListener('UniAppJSBridgeReady', function() {
// 获取当前环境
uniWebView.getEnv(function(res) {
if (res.miniprogram) {
// 微信小程序环境，给登录设置点击监听（会同时响应@click）
document.querySelector(".login").addEventListener('click', function() {
uniWebView.switchTab({
url: '/pages/tabBar/API/API'
});
})
}
});
});
}
}
</script>
<style>
</style>
