1. 使用
<iframe id='iframe' width='100%' height='400px' frameborder='no' border='0' scrolling='no' src={this.url} />
2. 窗体传值
frame加载完成再处理传值
const iframe: any = document.querySelector('#iframe');
if (iframe.attachEvent) {
iframe.attachEvent('onload', () => {
this.updateIframeAttribute(iframe);
});
} else {
iframe.onload = () => {
this.updateIframeAttribute(iframe);
};
}
通过postMessage 窗体传值
private updateIframeAttribute(iframe: any) {
iframe.contentWindow.postMessage(this.instanceRecords || [], '*'); // 传送数据,xxx
}
接收值
private messageSub: Subscription;
if (this.messageSub) {
this.messageSub.unsubscribe();
}
this.messageSub = fromEvent(window, 'message').subscribe((s: any) => {
if (s.data instanceof Array) { // 这里通过传送过来的数据类型,来区分message 多次触发问题
console.log(s.data);
this.instanceRecords = s.data;
}
});