由于iframe是引入外嵌的html,无法设置自适应高度
解决办法:
<div class="funcard-box" id="id-funcard">
<iframe id="myIframe" src="" frameborder="0" height="500px" width="100%"></iframe>
</div>
mounted() {
this.setMyIframeHeight();
window.addEventListener("resize", () => this.setMyIframeHeight(), false);
}
beforeDestroy() {
window.removeEventListener("resize", this.setMyIframeHeight(), false);
},
methods:{
setMyIframeHeight(){
let that = this;
this.$nextTick(() => {
let bodyHeight = document.body.clientHeight;
let outHeight =parseFloat(bodyHeight)-5+ "px";
console.log('获取到le',bodyHeight);
//设置iframe页面高度 因为在iframe时页面已经生成,高度无法改变,需要在iframe生成后直接设置高度
document.querySelector("#myIframe").style.height = outHeight;
});
},
}
document.querySelector('#myIframe').src = this.funcardUrl