<template>
  <el-container class="aos-main" :style="{height:realHeight}">
    <slot></slot>
  </el-container>
</template>
<script>
export default {
  name: 'AosMain',
  componentName: 'AosMain',
  data(){
    return {
      realHeight: 16
    }
  },
  mounted(){
    this.$parent.$children.forEach((item) => {
      if((item.$el && item.$el.className && item.$el.className.indexOf('aos-main-title') > -1) || (item.$el && item.$el.className && item.$el.className.indexOf('aos-button-area') > -1)){
        this.realHeight += item.$el.offsetHeight;
      }
    })
    this.realHeight = 'calc(100% - '+this.realHeight+'px'+')';
  }
};
</script>

