How do I set up a route exit in the tab component of iview?

what should I do if I want to display a vue component in each page of tab in iview, and tab is dynamically rendered (in the form of a new tab in a browser window, but in a single-page application)?

    <div>
      <Tabs type="card" closable @on-tab-remove="tabRemove" v-model="activeIndex" 
      @tab-click="tabClick" v-if="options.length">
        <TabPane v-for="(item, index) in options" :key="item.name" :label="item.name" 
         :name="item.route"></TabPane>
      </Tabs>
    </div>
Mar.24,2021

empty tabpane, puts router-view outside

<Tabs type="card" 
      closable 
      @on-tab-remove="tabRemove" 
      v-model="activeIndex"
      @tab-click="tabClick"
      v-if="options.length">
        <TabPane v-for="(item, index) in options" 
                 :key="item.name" 
                 :label="item.name" 
                 :name="item.route">
        </TabPane>
</Tabs>
<router-view></router-view>
...
tabClick(name){
    this.$router.push(name)
}

learn about dynamic components

<Tabs type="card" 
      closable 
      @on-tab-remove="tabRemove" 
      v-model="activeIndex"
      @tab-click="tabClick"
      v-if="options.length">
        <TabPane v-for="(item, index) in options" 
                 :key="item.name" 
                 :label="item.name" 
                 :name="item.route">
           <component :is="componentName"></component>
        </TabPane>
</Tabs>
...
import componentName form 'xxxx.vue'
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1ebd565-4872a.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1ebd565-4872a.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?