u-link.vue 2.1 KB
Newer Older
Y
init  
yurj26 已提交
1
<template>
2 3 4
  <view class="uni-row">
    <text class="text" :href="href" @click="openURL" :inWhiteList="inWhiteList">{{text}}</text>
  </view>
Y
init  
yurj26 已提交
5 6
</template>

7
<script lang="uts">
8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56
  /**
   * @description u-link是一个外部网页超链接组件,在小程序内打开内部web-view组件或复制url,在app内打开外部浏览器,在h5端打开新网页
   * @property {String} href 点击后打开的外部网页url,小程序中必须以https://开头
   * @property {String} text 显示的文字
   * @property {Boolean} inWhiteList 是否在小程序白名单中,如果在的话,在小程序端会直接打开内置web-view,否则会只会复制url,提示在外部打开
   * @example * <u-link href="https://ext.dcloud.net.cn" text="https://ext.dcloud.net.cn" :inWhiteList="true"></u-link>
   */
  export default {
    name: 'u-link',
    props: {
      href: {
        type: String,
        default: ''
      },
      text: {
        type: String,
        default: ''
      },
      inWhiteList: {
        type: Boolean,
        default: false
      }
    },
    methods: {
      openURL() {
        // // #ifdef APP-PLUS
        // plus.runtime.openURL(this.href) //这里默认使用外部浏览器打开而不是内部web-view组件打开
        // // #endif
        // // #ifdef H5
        // window.open(this.href)
        // // #endif
        // // #ifdef MP
        // if (this.inWhiteList) { //如果在小程序的网址白名单中,会走内置webview打开,否则会复制网址提示在外部浏览器打开
        // 	uni.navigateTo({
        // 		url: '/pages/component/web-view/web-view?url=' + this.href
        // 	});
        // } else {
        // 	uni.setClipboardData({
        // 		data: this.href
        // 	});
        // 	uni.showModal({
        // 		content: '本网址无法直接在小程序内打开。已自动复制网址,请在手机浏览器里粘贴该网址',
        // 		showCancel: false
        // 	});
        // }
        // // #endif
      }
    }
  }
Y
init  
yurj26 已提交
57 58 59
</script>

<style>
60 61 62 63 64 65
  .text {
    color: #7A7E83;
    font-size: 14px;
    line-height: 20px;
    /* border-bottom: 1px solid #7A7E83; */
  }
Y
init  
yurj26 已提交
66
</style>