<template><el-row><el-col :span="24"><el-row ref="headerMenu"class="header-menu"><el-col :span="24"><el-menu router mode="horizontal"><el-menu-item index="1" route="/global-overview">全局概览</el-menu-item><el-menu-item index="2" route="/e-commerce-business">电商业务</el-menu-item><el-menu-item index="3" route="/douniao-business">抖鸟业务</el-menu-item><el-menu-item index="4" route="/administrative-business">行政业务</el-menu-item><el-menu-item index="5" route="/admin">管理员入口</el-menu-item></el-menu></el-col></el-row><el-row ref="routerView"><router-view></router-view></el-row></el-col></el-row></template><script>exportdefault{
name:"home-page",mounted(){/**
* when the component is hung, dynamically obtain the height of the header menu,
* and set this value to router view as margin top
*/this.$refs.routerView.$el["style"].marginTop =`${this.$refs.headerMenu.$el["offsetHeight"]}px`;}}</script><style scoped>.header-menu {
position: fixed;
top:0;
width:100%;
z-index:999;}</style>