vue3页面加载完成后获取高度

1.绑定样式以便动态修改高度属性

<template>
  <el-container :style="{height:this.autoHeight+'px'}">
    <el-aside>
      <LeftMenu></LeftMenu>
    </el-aside>
    <el-main>
      <router-view></router-view>
    </el-main>
  </el-container>
</template>

在data方法中返回高度变量，mounted方法中获取文档高度，并赋值给高度变量

<script>

  import LeftMenu from './view/LeftMenu.vue'
  import {nextTick} from 'vue'

  export default {
    name:"App",
    components:{
      LeftMenu
    },
    data(){
      return {
        autoHeight: 0
      }
    },
    mounted() {
      nextTick(()=>{
        this.autoHeight = document.documentElement.clientHeight;
        console.log(this.autoHeight)
      })
    }
  }
  
</script>