vue文件内嵌 HTML文件iframe用法

首先vue里面内嵌html文件必须存放在项目 public文件夹下，可以和vue里面index.html同级如图所示：

我这里的 draw_PLS.html存放的是内嵌的html，map.js则是HTML里面的js。

以我项目为例

1.首先在vue页面里面通过iframe 的形式引用 注意 ref的值和 name的值我这里保持一致了，接下来都会有用到。（注意src里面的路径要和项目的路径一致哦）

例：this.srcurl=' http://192.168.0.0:9527/draw_PLS.html'

2.通过 声明一个iframes获取到iframe，然后添加一个name的属性，this.datavallist为我需要传递的数组，通过 iframes.postMessage 的方法进行传递。（cmd:'dian'用于做判断使用，可以不传）

3.在 draw_PLS.html 做如下 *** 作

这样就可以获取到啦。

：有什么地方不懂的可以找我共同进步，写的不够好还请多多包涵。

对的，直接引入就好，在头部引用：

<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">

<link rel="stylesheet" type="text/css" href="../../themes/icon.css">

<script type="text/javascript" src="../../jquery.min.js"></script>

<script type="text/javascript" src="../../jquery.easyui.min.js"></script>

另外需要对Vue进行初始化

new Vue({el:id,data{name:"aaa"}})，html<span>{{name}}</span>

用法：使用基础 Vue 构造器，创建一个“子类”。参数是一个包含组件选项的对象。

_ata 选项是特例，需要注意 - 在 Vue.extend() 中它必须是函数

_xtend 创建的是 Vue 构造器，而不是我们平时常写的组件实例，所以不可以通过 new Vue({ components: testExtend }) 来直接使用，需要通过 new Profile().$mount('selector选择器') 来挂载到指定的元素上。

_ue.extend + vm.$mount 组合

---