vue.js - mint-ui的swipe的轮播图里面除了第一张可以点击跳转之外，其余不可跳转

问题描述

问 题

使用的是mint-ui的自带swipe但是里面填写router-link但是没办法跳转，第一张轮播图就可以，第二张第三张就不行了，点击出现一下白屏，

暂时找到了这个源码分析，还没找到解决方法，还是我的姿势就不对，http://blog.csdn.net/u0100146...

<template>
    <div class="page-swipe">
        <mt-swipe >
            <mt-swipe-item class="slide1">
                <router-link to="/mine">
                    <img src="../assets/100x100.png"/>
                </router-link>
            </mt-swipe-item>
            <mt-swipe-item class="slide2">
                <router-link to="/product">
                    <img src="../assets/100x100.png"/>
                </router-link>
            </mt-swipe-item>
            <mt-swipe-item class="slide3">
                <router-link to="/detailPage">
                    <img src="../assets/100x100.png"/>
                </router-link>
            </mt-swipe-item>
        </mt-swipe>
    </div>
</template>
<style scoped>
.mint-swipe {
    width: 100%;
    height: 200px;
    color: #fff;
    font-size: 30px;
    text-align: center;
}
.mint-swipe a {
    display: block;
    height: 200px;
}
.slide1 {
    background-color: #0089dc;
    color: #fff;
    position: relative;
}
.slide2 {
    background-color: #ffd705;
    color: #000;
    position: relative;
}

.slide3 {
    background-color: #ff2d4b;
    color: #fff;
    position: relative;
}
<style>

暂时想到的方法是给组件增加点击事件，然后router push进行跳转，但是不知道安卓的兼容性怎么样，昨天看的貌似是6.2以上才支持

解决方案

点击出现白屏，会不会是路由设置有问题？另外，如果担心history兼容性问题，可以使用hash路由的window.location.hash = '想要跳转到的路径'。

这篇关于vue.js - mint-ui的swipe的轮播图里面除了第一张可以点击跳转之外，其余不可跳转的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！