先来看个效果图
例:http://localhost:9527/#/iframe/urlPath?src=https://www.baidu.com (访问百度)
格式:http://localhost:9527/#/iframe/urlPath?src=第三方的网站
并且支持判断iframe是否加载完成的等待框以及浏览器窗口变化做出的响应
改造代码
./src/views/iframe/index.vue(第三方iframe组件)
export default {
name: 'myiframe',
data() {
return {
fullscreenLoading: false,
urlPath: this.getUrlPath()
}
},
created() {
this.fullscreenLoading = true
},
mounted() {
this.iframeInit()
window.onresize = () => {
this.iframeInit()
}
},
props: ['routerPath'],
watch: {
routerPath: function(val) {
this.url