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>
相关推荐
不会就选b19 分钟前
linux之进程管理(二)--替换
linux·运维·服务器
倔强的石头10624 分钟前
【Linux指南】动静态库系列(二):从源码复用到目标文件复用:为什么需要把 .o 打包成库
linux·运维·服务器
码农学院30 分钟前
GEO与SEO协同:从传统搜索到生成式搜索的平滑迁移路径
服务器·前端·python
步步精BBJconn33 分钟前
从GPU服务器到数据中心:AI服务器高压连接器的应用与发展趋势
大数据·运维·服务器·人工智能·科技·物联网
爱写代码的森9 小时前
鸿蒙三方库 | harmony-utils之ImageUtil图片保存到本地详解
服务器·华为·harmonyos·鸿蒙·huawei
广州灵眸科技有限公司10 小时前
xfce桌面触摸校准:基于灵眸科技EASY-EAl-Orin-Nano
数据库·windows·科技
HLC++13 小时前
Linux的进程间通信
android·linux·服务器
白露与泡影14 小时前
Arthas 实战指南:从方法耗时定位到 JVM 变量热修改
服务器·jvm·c#
神奇霸王龙15 小时前
Claude Code屠榜:MiMo与Grok紧追Codex
服务器·网络·人工智能·gpt·ai·ai编程
Web极客码15 小时前
WordPress SEO优化:提升网站排名的13个关键步骤
服务器·seo·wordpress