iframe与父元素之间的传值方式

1、iframe向父元素传值

iframe中的代码

var height = calcPageHeight(document);
window.parent.postMessage({
   message: 'getCrossHeight',
   height,
}, '*');

父元素监听

window.addEventListener('message', function(e){
  if (e.data.message === 'getCrossHeight') {
     let crossHeight = e.data.height;
     let ifr = document.querySelector('#truntable');
     ifr.style.height = crossHeight + 'px';
  }
}, false);

2、父元素向iframe传值

父元素中的代码

const truntable = (document.getElementById("truntable") || {}).contentWindow || {};
truntable.postMessage({
   message: 'meetConditions',  // 满足条件
   value: true,
}, '*');

iframe监听

window.addEventListener('message', function(e){
  if (e.data.message === 'meetConditions') {
    if (e.data.value) {
      api.getLuckCount();
    }
  }
}, false);