vue element-ui侧边栏撑满全屏且不加滚动条

要使Element UI的侧边栏撑满全屏且不加滚动条，可以通过设置样式来实现。以下是实现这一需求的CSS样式和Vue组件示例代码：

CSS样式:

.sidebar {
  height: 100vh; /* 设置侧边栏的高度为视口高度 */
  width: 200px; /* 设置侧边栏的宽度 */
  position: fixed; /* 固定侧边栏的位置 */
  top: 0; /* 侧边栏距离顶部0 */
  left: 0; /* 侧边栏距离左侧0 */
  overflow: hidden; /* 隐藏溢出内容，防止滚动条 */
}

Vue组件:

<template>
  <el-container style="margin-left: 200px;">
    <el-aside width="200px" class="sidebar">
      <!-- 侧边栏内容 -->
    </el-aside>
    <el-main>
      <!-- 主内容区 -->
    </el-main>
  </el-container>
</template>
 
<style>
.sidebar {
  height: 100vh; /* 设置侧边栏的高度为视口高度 */
  width: 200px; /* 设置侧边栏的宽度 */
  position: fixed; /* 固定侧边栏的位置 */
  top: 0; /* 侧边栏距离顶部0 */
  left: 0; /* 侧边栏距离左侧0 */
  overflow: hidden; /* 隐藏溢出内容，防止滚动条 */
}
</style>

在这个示例中，.sidebar 类设置了侧边栏的高度为视口高度（100vh），宽度（200px），并且通过 position: fixed; 固定在屏幕上。overflow: hidden; 则确保了在内容超出侧边栏大小时不会出现滚动条。在 <el-container> 上设置的样式 margin-left: 200px; 用于保证主内容区不会与侧边栏重叠。