我這邊做了一個cordova+vue+framework7的項目，寫了一個tabbar 切換頁面，但是發(fā)現(xiàn)在tabbar的頁面里面使用loadpage，a標簽，或者listitem里的link屬性跳轉頁面（雖然這三種方法都是一個意思），都只能看到要加載的頁面一閃而過，然后又被原先的頁面取代掉

正常來講頁面跳轉后應該是這個效果

我這邊的異常頁面最后是這樣的

下面是代碼

<template>
    <f7-page>
        <!--<f7-navbar :title="navTitle" back-link="返回" sliding></f7-navbar>-->
        <!--<f7-navbar class="HomeNav">-->
        <!--<f7-nav-left></f7-nav-left>-->
        <!--<f7-nav-center sliding>{{navTitle}}</f7-nav-center>-->
            <!--<f7-nav-right>-->
                <!--<f7-button v-on:click="toggoleBoard" style="color:white;font-size:26px!important" class="loginBtn" icon="tuichu iconfont icon-shezhi">-->
                <!--</f7-button>-->
            <!--</f7-nav-right>-->
        <!--<div class="changepass" v-bind:style="showclickBoard==true?{'height':'60px'}:{'height':0}">-->
            <!--<span v-on:click="Logout">退出登錄</span>-->
            <!--<span v-on:click="back">回到首頁</span>-->
        <!--</div>-->
        <!--</f7-navbar>-->

        <f7-toolbar tabbar labels>
            <f7-link v-on:click="tabshow('工作')" icon="iconfont icon-gongzuo" text="工作" route-tab-link="#tab1" active href="/index/"></f7-link>
            <f7-link v-on:click="tabshow('系統(tǒng)')" icon="iconfont icon-xitong" text="系統(tǒng)" route-tab-link="#tab2" href="/index/tab2/"></f7-link>
            <f7-link v-on:click="tabshow('報表')" icon="iconfont icon-shouji" text="報表" route-tab-link="#tab3" href="/index/tab3/"></f7-link>
        </f7-toolbar>
        <f7-tabs>
          <f7-tab route-tab-id="tab1" active></f7-tab>
          <f7-tab route-tab-id="tab2"></f7-tab>
          <f7-tab route-tab-id="tab3"></f7-tab>
        </f7-tabs>
  </f7-page>
</template>

這是tabbar頁面的

下面是有跳轉鏈接的頁面 目前在tabBar的三個頁面都無法跳轉

<template>
    <f7-page class="tab1">
            <div class="showInfo flex justify-content_flex-justify align-items_center">
                <div class="headbox">
                    <img src="../../../images/head.jpg" alt="">
                </div>
                <div class="infobox flex align-items_flex-start justify-content_flex-justify">
                    <div class="flex todayComplet">
                        <span style="font-size:80px;line-height:80px;margin-top:20px;">30</span>
                        <div style="font-size:16px">
                            今日完成
                        </div>
                    </div>
                    <div class="target flex justify-content_flex-justify" v-on:click="todata">
                        <span>2000</span>
                        <div style="margin-bottom: 18px;">月目標計劃</div>
                        <span>200</span>
                        <div>今日計劃</div>
                    </div>
                </div>
            </div>
            <f7-list
                :v-infinite-scroll="loadMore"
                infinite-scroll-disabled="loading"
                infinite-scroll-distance="10"
            >
                <f7-list-item v-for="(item,index) in outList"
                      :key="index"
                      :after="item.DisTime"
                      :title="item.Title + '<br/>'+ '<span style=font-size:14px;color:red>未參與</span>'"
                      link="outsource"    
                >
                </f7-list-item>
            </f7-list>
    </f7-page>
</template>

望大神不吝賜教