| 提交 | 用户 | 时间 | ||
| e57a89 | 1 | <template> |
| 懒 | 2 | <div :style="'height:' + height" v-loading="loading" element-loading-text="正在加载页面，请稍候！"> |
| 3 | <iframe | |
| 4 | :id="iframeId" | |
| 5 | style="width: 100%; height: 100%" | |
| 6 | :src="src" | |
| 7 | frameborder="no" | |
| 8 | ></iframe> | |
| 9 | </div> | |
| 10 | </template> | |
| 11 | ||
| 12 | <script> | |
| 13 | export default { | |
| 14 | props: { | |
| 15 | src: { | |
| 16 | type: String, | |
| 17 | default: "/" | |
| 18 | }, | |
| 19 | iframeId: { | |
| 20 | type: String | |
| 21 | } | |
| 22 | }, | |
| 23 | data() { | |
| 24 | return { | |
| 25 | loading: false, | |
| 26 | height: document.documentElement.clientHeight - 94.5 + "px;" | |
| 27 | }; | |
| 28 | }, | |
| 29 | mounted() { | |
| 30 | var _this = this; | |
| 31 | const iframeId = ("#" + this.iframeId).replace(/\//g, "\\/"); | |
| 32 | const iframe = document.querySelector(iframeId); | |
| 33 | // iframe页面loading控制 | |
| 34 | if (iframe.attachEvent) { | |
| 35 | this.loading = true; | |
| 36 | iframe.attachEvent("onload", function () { | |
| 37 | _this.loading = false; | |
| 38 | }); | |
| 39 | } else { | |
| 40 | this.loading = true; | |
| 41 | iframe.onload = function () { | |
| 42 | _this.loading = false; | |
| 43 | }; | |
| 44 | } | |
| 45 | } | |
| 46 | }; | |
| 47 | </script> | |
