# 全局的组件如何使用 ``` <main-theme1 ref="mainTheme"> <template slot="headerRight"> <div @click="logout">退出登录</div> </template> <template slot="headerLine"> <div class="hd-line"></div> </template> <router-view></router-view> </main-theme1> ``` ### mainTheme1 props | 属性 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | logoPath | logo图片 | String | default | | avatarPath | 登录后的头像 | String | default | | siderWidth | 左侧菜单的宽度 | Number | 200 | | headerMenusShow | 是否显示顶级菜单 | Booble| true | ### mainTheme1 slot | 名称 | 说明 | | --- | --- | | headerRight | 头部右侧的内容，调用退出功能：this.$refs.mainTheme.logout() | |headerLine| 头部下面的div，可以自定义样式|