Vue element ui select disposed on the object tag

When using custom reports (grid ++ report server Report), due to the object grid ++ server statements are used to load the report data, found object is always above the div layer by Baidu basically say that the object tag flash solutions . Also try a variety, we can not solve my problem. So I can only come up transformation select components from the source base element
as shown above by the console debugging see the generated html components found el-scrollbar, because I know the level above the iframe object. So el-scrollbar placed div to wrap the iframe.

 <el-scrollbar
          tag="ul"
          wrap-class="el-select-dropdown__wrap"
          view-class="el-select-dropdown__list"
          ref="scrollbar"
          style="z-index:2;"
          :class="{ 'is-empty': !allowCreate && query && filteredOptionsCount === 0 }"
          v-show="options.length > 0 && !loading">
          <el-option
            :value="query"
            created
            v-if="showNewOption">
          </el-option>
          <slot></slot>
        </el-scrollbar>
          <div v-if="loadiframe" :style="{display:visible===true?'block':'none'}" style="opacity:0.5;position:absolute;top:0;height:100%;width:100%;z-index:1;"> <iframe frameborder="0" width="100%" height="100%"></iframe></div>

Element code is compiled directly npm run dist, resulting in the replacement project lib lib
can be seen, I el-scrollbar the z-index is set 2, iframe is provided div translucent, z-inex set to 1. Thus ul> li can be placed on top of. (Figure 2) to view the results

before did not look at the transformation (Figure 3)