uni-app页面通过点击跳转至外部链接

最新推荐文章于 2025-06-06 17:05:44 发布

转载最新推荐文章于 2025-06-06 17:05:44 发布 · 1w 阅读

13 ·

CC 4.0 BY-SA版权

原文链接：https://www.cnblogs.com/xutao1517588477/p/15239426.html

文章标签：

#小程序 #微信小程序

QT 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了如何在Vue组件中使用uni.navigateTo在含webView页面间跳转，通过实例展示了如何设置webView的src，并确保新页面在pages.json中注册。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、先新建一个vue文件，如下：

<template>
    <web-view :src="url"></web-view>
</template>

<script>
    export default {
        data() {
            return {
                url:''
            }
        },
        onLoad(item) {
            this.url = item.url
        }
    }
</script>

<style lang="scss">

</style>

二、使用uni.navigateTo进行跳转

      <view v-for="(item,i) in List" :key="i" >
        <view @click="openUrl(item)" >
          <image v-if="item.img_src" :src="item.img_src"></image>
          <view class="vi_title">{{item.title}}</view>
        </view>
      </view>

methods: {
      openUrl(item) {
        uni.navigateTo({
          url:'/pages/common/webview?url=' + item.url
        })
      }
    }

需要注意的是：新建的含webView的页面必须在pages.json的pages里注册
参考原文：https://www.cnblogs.com/xutao1517588477/p/15239426.html