uniapp jump internal link/external link (idea: webview)

1. First build an internal page webview .vue in your uniapp project pages.json

1.1 Point to the internal path we jump to in page.json: the code is as follows

{
  "path": "pages/webview/webview",
  "style": {
        "navigationBarTitleText": "",
        "enablePullDownRefresh": false
}

1.2 Build an internal page webview .vue under the pages/webview folder

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

<script>
export default {
  data() {
    return {
      url: ''
    }
  },
  onLoad(item) {
    // 传入需要跳转的链接 使用web-view标签进行跳转
    this.url = decodeURIComponent(item.url)
    // console.log(this.url)
  }
}
</script>

2. Reference this method on the page that needs to be operated => click to trigger the jump

<template>
    <view class="uni-form-right" @tap="getApp">平台跳转</view>
</template>

<script>
    // 点击功能模块-触发跳转
    getApp() {
      let url = 'https://www.baidu.com' 
      // 以百度url为例子,具体填写你自己要跳转的链接 
      uni.navigateTo({
        url: '/pages/webview/webview?url=' + url
        // page.json定义的路径 传url到webview界面去接收-实现跳转
      })
    }
</script>

3. Supplement: uniapp jumps to external links: window.location.href = 'https://www.baidu.com';

Guess you like

Origin blog.csdn.net/m0_69257679/article/details/128641542