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>
相关推荐
C+ 安口木17 分钟前
Alibaba Cloud Linux 3 服务器环境搭建实战记录
linux·运维·服务器
绮罗郁金香18 分钟前
windows延迟更新
windows
聚搜云——JuSouClouD20 分钟前
杭州腾讯云代理商:腾讯云2核4G服务器够用吗?网站、API和开发测试怎么选
服务器·云计算·腾讯云
zhangguojia71 小时前
权限弹窗点击允许的授权流程
运维·服务器·数据库
AI备忘录1 小时前
(十九)华为华三锐捷迈普思科 交换机链路聚合配置命令(LACP/静态聚合五厂商对照)
运维·服务器·网络·网络协议·tcp/ip·华为
其实防守也摸鱼2 小时前
教育信息技术应用创新---基础软件信息赛
运维·服务器·数据库·github·copilot
苏生Susheng2 小时前
【软件实施】Windows 服务器运维实战
java·运维·服务器·windows·spring boot·javaweb·实施
且白2 小时前
node、npm通过http-server架设本地服务器(可解决跨域)
服务器·网络协议·http
Gauss松鼠会2 小时前
【GaussDB】GaussDB 组件、节点和AZ故障仲裁与切换流程
运维·服务器·数据库·gaussdb
方向研究2 小时前
UEFI/Windows启动流程
windows