123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172 |
- <template>
- <el-dialog :title="title" append-to-body class="iframe" :visible.sync="dialog.details" width="500px">
- <iframe :id="id" name="google_ads_frame2" frameborder="0" width="100%" height="300px" :src="iframeSrc" marginwidth="0" marginheight="0" vspace="0"
- hspace="0" allowtransparency="true" scrolling="no" allowfullscreen="true"></iframe>
- </el-dialog>
- </template>
- <script>
- export default {
- data() {
- return {
- id: 'google_ads_frame2' + new Date().getTime()
- }
- },
- props: {
- iframeSrc: {
- type: String,
- default: ""
- },
- title: {
- type: String,
- default: "详情"
- },
- dialog: {
- type: Object,
- default: function () {
- return {
- details: false
- }
- }
- },
- setData: {
- type: [Array, String],
- default: function () {
- return []
- }
- }
- },
- methods: {
- setMess() {
- this.$nextTick(_ => {
- let iframe = document.getElementById(this.id)
- iframe.onload = () => {
- let arr = this.setData.map(i => ({
- key: i.Key,
- name: i.Name,
- type: i.Type
- }))
- iframe.contentWindow.postMessage(arr, "*")
- }
- })
- }
- },
- watch: {
- dialog: {
- deep: true,
- handler: function () {
- if (this.dialog.details) {
- this.setMess()
- }
- }
- }
- }
- }
- </script>
- <style lang="less" scoped>
- #google_ads_frame2 {
- height: 300px;
- overflow: auto;
- }
- </style>
|