<template> <div style="display: none"> <iframe :id="id" :src="url" frameborder="0" width="100%" height="550px" scrolling="auto"> </iframe> </div> </template> <script> import Vue from 'vue' import { ACCESS_TOKEN } from "@/store/mutation-types" export default { name: "PdfPreviewModal", data () { return { url: window._CONFIG['pdfDomainURL'], id:"pdfPreviewIframe", headers:{} } }, created () { const token = Vue.ls.get(ACCESS_TOKEN); this.headers = {"X-Access-Token":token} }, computed:{ }, mounted(){ window.addEventListener('message', this.handleScanFileMessage); }, methods: { handleScanFileMessage (event) { // 根据上面制定的结构来解析iframe内部发回来的数据 const data = event.data; console.log(data); }, previewFiles (title,token) { var iframe = document.getElementById("pdfPreviewIframe"); var json = {"title":title,"token":token}; iframe.contentWindow.postMessage(json, "*"); }, } } </script> <style scoped> </style>