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>
相关推荐
weixin_307779134 小时前
Linux下Nginx故障系统化检查Shell脚本
linux·运维·服务器·nginx·自动化
山峰哥6 小时前
数据库工程与索引策略实战指南‌
服务器·数据库·sql·oracle·深度优先
印度神油97 小时前
Windows Python 打包实战:Nuitka 环境踩坑总结与 CI 自动化构建全指南
windows·python·ci/cd
2601_963771377 小时前
Hardening Enterprise WordPress Sites Against REST API Leaks and Bad Headers
前端·windows·word·php
2501_925963387 小时前
Hi3516CV610 + MPU6050 DMP 软件 EIS 防抖笔记
linux·运维·服务器
不法9 小时前
uniapp map地图导航/地图路线
前端·vue.js·uni-app
随性而行3609 小时前
微信API接口与AI自动化:开发者的实现思路
运维·服务器·开发语言·人工智能·微信·自动化
不要小看我们之间的羁绊啊10 小时前
【windows】cc + cc switch + headroom
windows
snow@li10 小时前
Java:Java 服务器(Web 容器 / Servlet 容器)完整工作清单
java·服务器·前端
JL1511 小时前
Agent工程-为什么Agent必须有观测和Tracing
服务器·网络·人工智能·安全