实现应用内超连接组件

Tevin

2021-11-01 cf6ea209637f02e20ed658e8ee060ed8eacc81fd

实现应用内超连接组件

 layout/anchor/CAnchor.vue

New file
@@ -0,0 +1,48 @@
/**
 * CAnchor - 应用内超连接
 * @author Tevin
 */

<template>
    <view
        class="c-anchor"
        @tap="evt => handleGoTo()"
    >
        <slot />
    </view>
</template>

<script>
import Taro from '@tarojs/taro';

export default {
    name: 'CAnchor',
    props: {
        href: String,
        rel: {
            type: String,
            default: 'navigate',
        },
    },
    data() {
        return {};
    },
    methods: {
        handleGoTo() {
            if (!this.href) {
                return;
            }
            if (this.rel === 'navigate') {
                if (this.href === 'back') {
                    Taro.navigateBack();
                } else {
                    Taro.navigateTo({ url: this.href });
                }
            } else if (this.rel === 'redirect') {
                Taro.redirectTo({ url: this.href });
            }
        },
    },
    mounted() {},
};
</script>

 layout/anchor/index.js

New file
@@ -0,0 +1,10 @@
/**
 * CAnchor
 * @author Tevin
 */

import CAnchor from '@components/layout/anchor/CAnchor.vue';

export {
    CAnchor,
}