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>
相关推荐
Benszen3 分钟前
Linux容器简介
linux·运维·服务器
一个人旅程~3 分钟前
win11中启用经典win10右键菜单和还原默认win11右键菜单如何操作
windows·经验分享·macos·电脑
剑神一笑4 分钟前
Linux iptables 深度解析:从规则匹配到 NAT 转发实战
linux·运维·服务器
梦想的颜色6 分钟前
Docker 入门指南:从零开始掌握容器化技术
运维·服务器·vscode·python·算法·docker·云原生
handler017 分钟前
【Linux 网络】:poll/epoll 底层机制与 Reactor 并发模型
linux·运维·服务器·网络·c++·多路转接·多路复用
Cloud_Shy6189 分钟前
解读《Effective Python 3rd Edition》:从练气到老魔(第二章 Item 10 - 12)
c语言·开发语言·网络·人工智能·windows·python·编辑器
devilnumber10 分钟前
Java Lambda 分片(分组 / 分区)超详细讲解
windows
霸道流氓气质10 分钟前
导入历史跟踪机制实战指南
java·linux·服务器
肖爱Kun11 分钟前
GB28181启动传参的设计
linux·服务器·数据库
剑神一笑15 分钟前
Linux systemctl 服务管理命令:从 systemd 架构到实战技巧
linux·服务器·架构