ModalCard组件单独维护大图/视频切换字段,多个实例互不影响切换效果

hanbaoshan

2020-11-26 d093a961992dd932884015bd5282ba4ca20b97a0

ModalCard组件单独维护大图/视频切换字段,多个实例互不影响切换效果

 src/components/subComponents/ModelCard.vue

@@ -1,6 +1,6 @@
<template>
  <div class="model-card-box" :style="`height:${height};width:${width};`">
    <el-tabs style="height: 100%;" @before-leave="changeTabs" v-model="VideoPhotoData.activeName">
    <el-tabs style="height: 100%;" @before-leave="changeTabs" v-model="activeName">
      <el-tab-pane label="大图" name="pic">
        <div
          class="model-card-box-left"
@@ -354,10 +354,11 @@
    console.log('ModelCard data',this.data);
    console.log(this.data.baseInfo)
    console.log(this.initialIndex)
    this.VideoPhotoData.activeName = "pic"
    //this.VideoPhotoData.activeName = "pic"
  },
  data() {
    return {
      activeName:'pic',
      initialIndex: 0,
    };
  },