<template>
  <div class="iframe">
    <div
      v-for="item in iframeList"
      :key="'iframeId'+item.meta.id"
      :class="{iframeShow:item.isShow}"
    >
      <iframe class="iframeContent" :id="`iframe`+item.meta.id"  :src="item.iframeUrl" frameborder="0">
      <!-- <iframe class="iframeContent" id="activeFrame"  frameborder="0"> -->
        <!-- <iframe class="content" sandbox="allow-scripts allow-top-navigation" :src="'https://www.w3school.com.cn/tags/tag_iframe.asp'"  frameborder='0'> -->
      </iframe>
    </div>
  </div>
</template>
<script>
import { mapState } from "vuex";

export default {
  computed: {
    ...mapState({
      // 动态主路由
      iframeList: state => state.homeApp.iframeList
    })
  },
  // mounted(){
  //   console.log(11111111111111111111111,this.iframeList);
    
  // }
};
</script>
<style lang="less" scoped>
.iframe {
  z-index: 2 !important;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    // background: hotpink;
    z-index: 2;
    iframe.iframeContent {
      width: 100%;
      height: 100%;
    }
    &.iframeShow {
    //   background: red;

      z-index: 3;
    }
  }
}
</style>