uniApp跳转外链

创建一个新的页面,在该页面中使用web-view组件加载外部URL:pages/web-view/web-view

javascript 复制代码
<template>
  <view>
    <uni-list>
      <uni-list-item
        title="打开外部链接"
        @click="openExternalLink"
      ></uni-list-item>
    </uni-list>
  </view>
</template>

<script>
export default {
  methods: {
    openExternalLink() {
      window.open('https://super.xiaoxilao.com/', '_blank');
    }
  }
}
</script>

<style>
/* 你的样式 */
</style>

在我们当前需要点击跳转的页面,增加点击事件,跳转到你创建的web-view页面,并传递URL参数:例如:/pages/index/index

javascript 复制代码
<template>
  <view>
    <uni-list>
      <uni-list-item
        title="打开外部链接"
        @click="openExternalUrl('https://super.xiaoxilao.com/')"
      ></uni-list-item>
    </uni-list>
  </view>
</template>

<script>
export default {
  methods: {
    openExternalUrl(url) {
      uni.navigateTo({
        url: `/pages/web-view/web-view?url=${encodeURIComponent(url)}`
      });
    }
  }
}
</script>

<style>
/* 你的样式 */
</style>
相关推荐
杨云龙UP1 小时前
Toad for Oracle 调整表空间 Datafile 大小:Usage、Used Pct of Max 与 RESIZE 实战
linux·运维·服务器·数据库·oracle·dba·数据库运维
梦曦i1 小时前
RouterLink v2.5.0:H5端原生能力全面回归
前端·uni-app
Csxyzj3 小时前
Nginx:企业高性能web服务器(一)
运维·服务器·nginx
旗开得胜马到成功3 小时前
工控系统备份的底层技术解析:老旧协议、零停机窗口与中科热备的专项破局
运维·服务器·vr
AC赳赳老秦3 小时前
企业标签体系搭建:基于 OpenClaw 采集的多维度公开数据,构建企业画像标签库
java·运维·服务器·python·信息可视化·deepseek·openclaw
码农刚子3 小时前
用 .NET 8 + uni-app 做一套多租户畜牧 SaaS:我们在秦巴牧云踩过的 6 个坑
uni-app·.net·saas
PedroQue993 小时前
RouterLink v2.5.0:H5端原生能力全面回归
前端·uni-app
2601_965798473 小时前
Evently Theme Setup Guide: Fast Conference, Meetup & Summit Architecture
服务器·网络·数据库
牢姐与蒯3 小时前
Linux进程(二)之进程概念
linux·运维·服务器·ubuntu
DOLA_Tech4 小时前
电脑共享文件夹教程(Windows、统信UOS、银河麒麟)
windows·电脑