使用uniapp提供的api实现跳转到web网页（h5）的功能，在开发小程序中，是一项很常见的功能开发，熟悉掌握uniapp的api，轻松实现！

详细步骤如下：

1. 在ui库中找到扫码icon，我以uViewUI为例

绑定点击事件@click

<u-icon class="scanIcon" name="scan" size="28" color="white" @click="clickScan"></u-icon>

2. 在事件clickScan中处理逻辑

 // 点击扫一扫
    clickScan() {
      // 使用uniapp提供扫码api
      uni.scanCode({
        scanType: ['qrCode'],
       // 扫码成功后的回调
        success: (res) => {
        // res中包含二维码中的信息，其中就有网络链接
        // 使用navigateTo跳转，并且携带参数，参数为二维码中的链接
          uni.navigateTo({
            // 这里注意，此地址只是自己提前写好的，并且路径前面一定要加/
            url:`/pages/webpage/index?link=${res.result}`
          })
        }
      })
    }

3. 在src文件夹中写一个组件，我定义为webpage

4. 在pages.json中添加该组件页面

        {
			"path": "pages/webpage/index",
			"style": {
				"navigationBarTitleText": "详情",
				"navigationBarTextStyle": "black",
				"app-plus": {
					"popGesture": "none"
				}
			}
		}

5. 来到该组件页面，完成网络链接的渲染

a. 使用uniapp中onLoad钩子获取到上一个页面跳转过来时，携带的参数，刚刚在逻辑处理中，跳转到该组件时，携带了一个网络链接；

b. 将网络链接给到data中的src，然后再使用Vue的数据绑定，绑定到web-view的src属性

c. 这里注意：渲染页面用到的是web-view组件，在uniapp官网有详解；将网络链接给到src属性，这样就实现了一整个页面，就是我要跳转的web页面

<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
    data() {
        return {
            src: ''
        }
    },
    onLoad(option) {
        console.log(option?.link)
        this.src = option?.link
    }
})
</script>

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