vue + iview页面Modal中内嵌Tabs，每次打开的时候Modal时默认选中Tabs的第一项

文档中说激活面板的name用value，页面第一次加载的时候可以，放在modal里就不好使了，每次打开的时候，当前激活的tab总显示上一次离开时的界面。

真正能用的是 this.$refs.tabs.activeKey = 'name1' ，此方法也可以动态设置Tabs页面。

下面看一下代码：

<Modal
          title="监控信息"
          width="1260"
          v-model="isShowCdElement"
          class-name="vertical-center-modal" :scrollable="true" :closable="false" mask="true" :mask-closable="false">
          <div class="card-tabs-element" ref="element" style="overflow-y: auto;">
            <Tabs ref="tabs" type="card" @on-click="handleTabClick">
              <TabPane :ref="'tab-'+item.id" :label="'组号'+item.id" :name="'tab'+item.id" context-menu v-for="(item,index) in tabsNum" :disabled ="item.status">
                <Table :columns="elementColumns" :data="elementList" :loading="elementLoading"></Table>
                <Page
                  :total="elementTotal"
                  :page-size="elementPageSize"
                  :current="elementPageNum"
                  show-elevator show-sizer show-total
                  @on-change="getElements"
                  @on-page-size-change="handleElementChangeSize"></Page>
              </TabPane>
              <template slot="contextMenu">
              </template>
            </Tabs>
          </div>

          <div slot="footer">
            <Button type="primary" @click="modalCdElementSubmit" :disabled="elementSubmitShow">确认</Button>
            <Button type="primary" @click="modalCdElementCancel" :disabled="elementCancelShow">取消</Button>
          </div>
        </Modal>

我这个里面放的是动态tab,tab个数是不固定的，那么每次请求的时候，需要初始化一下原来的值：

在data里面定义默认初始值，1个tab 

tabsNum: [{id:1,status:false}],

打开弹框的时候，当前激活的tab设置成第一个：

 //每次打开的时候，设置激活的tab是第一个
 this.$refs.tabs.activeKey = 'tab1'

每次在关闭弹框的时候，把这个tabNum设置成初始值。

这样每次弹框打开的时候，当前激活的tab就是默认的第一个了，而不是一次离开时的界面