copy1.nvue

<template>
  <view class="content">
    <CustomNavBar ref="navBar" :title="t('asis.HeatMap')" />
    <button @click="openWebview">打开</button>
    <button @click="closeWebview">关闭</button>
  </view>
</template>

<script setup>
import { onMounted,onBeforeUnmount } from 'vue';
import { onBackPress } from '@dcloudio/uni-app'
import CustomNavBar from '@/components/CustomNav.nvue'
import {
  t
} from '@/plugins/index.js'
let webview = null

onMounted(()=>{
  openWebview()
})
onBeforeUnmount(()=>{
})
onBackPress(()=>{
  closeWebview()
})

const openWebview = ()=>{
  // 销毁已存在的 WebView
  if (webview) {
    plus.webview.close(webview)
    webview = null
  }
  // 获取导航栏高度（默认值）
  // const navHeight = this.navHeight || 44
  const navHeight = 44
  const statusBarHeight = plus.navigator.getStatusbarHeight()
  const top = navHeight + statusBarHeight
  
  // 创建新 WebView
  webview = plus.webview.create(
    // "https://store.keliuyun.com/apph5/heatMap?token=6c094ce1-0eb7-4c57-ac12-ef28f6b54338&mallId=12750&startDate=2025-06-10&endDate=2025-06-16&level=rt",
    // "http://192.168.1.20:3000/apph5/demo",
    "https://store.keliuyun.com/apph5/heatMap?token=6c094ce1-0eb7-4c57-ac12-ef28f6b54338&mallId=12750&startDate=2025-06-10&endDate=2025-06-16&level=rt",
    "demo-webview",
    {
      top: `${top+100}px`,  // 关键：从导航栏下方开始
      bottom: "0px",
      left: "0px",
      right: "0px",
      'uni-app': 'none',
      popGesture:'close',
      // backButtonAutoControl:'close',
      hardwareAccelerated: true,
      wkwebview: true,
    }
  )
  webview.show()
  
  const webs = plus.webview.getWebviewById('demo-webview')

  console.log('=====');
  console.log(webs);
  // 添加事件监听
  webview.addEventListener("loaded", () => {
    console.log("网页加载完成")
  })
}
const closeWebview = ()=>{
  if(webview){
    // 正确关闭方式
    webview.hide()
    webview.close()
    webview = null
  }
}
</script>