elementui模板

Element UI 提供了一些内置的模板（Template）组件，这些组件使得在项目中使用一些常见的布局和结构更加方便。以下是一些常用的 Element UI 模板组件：

Container（容器）

`<el-container>` 是一个容器组件，用于布局整个页面的结构。它包含 `<el-header>`、`<el-aside>`、`<el-main>` 和 `<el-footer>` 四个子组件，可以方便地实现页面的头部、侧边栏、主体和底部布局。

```html

<template>

  <el-container>

    <el-header>Header</el-header>

    <el-aside width="200px">Aside</el-aside>

    <el-main>Main</el-main>

    <el-footer>Footer</el-footer>

  </el-container>

</template>

```

Aside（侧边栏）

`<el-aside>` 组件用于创建侧边栏，通常用于容纳一些导航链接或其他辅助性内容。

```html

<template>

  <el-container>

    <el-aside width="200px">

      <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose">

        <el-submenu index="1">

          <template slot="title">

            <i class="el-icon-location"></i>

            <span>导航一</span>

          </template>

          <el-menu-item-group>

            <el-menu-item index="1-1">选项1</el-menu-item>

            <el-menu-item index="1-2">选项2</el-menu-item>

          </el-menu-item-group>

        </el-submenu>

        <!-- 其他菜单项 -->

      </el-menu>

    </el-aside>

    <el-main>Main</el-main>

  </el-container>

</template>

```

Footer（底部）

`<el-footer>` 组件用于创建底部区域，通常用于显示一些版权信息或其他底部内容。

```html

<template>

  <el-container>

    <el-header>Header</el-header>

    <el-main>Main</el-main>

    <el-footer>Footer © 2023</el-footer>

  </el-container>

</template>

```

这只是 Element UI 模板组件的一小部分示例。你可以在 Element UI 的[官方文档](https://element.eleme.io/#/zh-CN/component/container)中找到更多模板组件的详细信息和用法。在文档中，你还能了解到每个组件支持的属性和事件等信息。