no message

Former-commit-id: aa19087e500aea381a2f7eb90721f2d9871272f1
Former-commit-id: e89fcc86afc432f9a84b203bd139615d5dea674f
Former-commit-id: db8808227a4aa2607af284c82fad0ccf60b93fa6

src/components/core/Container/index.vue

@@ -7,6 +7,7 @@
     </el-card>
     <!-- [ghost] 隐形的容器 -->
     <div v-if="type === 'ghost'">
+      <slot name="header"></slot>
       <slot></slot>
     </div>
     <!-- [full-card] 撑满 -->

src/pages/demo/components/container/index.vue

@@ -0,0 +1,6 @@
+<template>
+  <Container>
+    <template slot="header">页面容器组件 文档</template>
+    <Markdown url="/static/markdownFiles/article/组件 - 页面容器.md"></Markdown>
+  </Container>
+</template>

src/pages/demo/components/container/normal.vue

@@ -1,8 +1,6 @@
 <template>
   <Container>
     <template slot="header">我是插入到 header 中的内容</template>
-    <p style="margin-top: 0px;">这是一个最基础的页面容器</p>
+    <Markdown url="/static/markdownFiles/article/组件 - 页面容器 - 基础.md"></Markdown>
-    <p>它看起来像一个卡片</p>
-    <p style="margin-bottom: 0px;">它会将页面区域和导航区域区分开</p>
   </Container>
 </template>

src/router/menu/_components.js

@@ -16,6 +16,16 @@ export const menu = {
       title: '页面容器',
       icon: 'window-restore',
       children: [
+        {
+          title: '文档',
+          icon: 'file-o',
+          path: 'container',
+          name: 'demo-components-container',
+          meta: {
+            requiresAuth: true
+          },
+          component: resolve => { require(['@/pages/demo/components/container/index.vue'], resolve) }
+        },
         {
           title: '卡片',
           icon: 'file-o',

static/markdownFiles/article/组件 - 页面容器 - 基础.md

@@ -0,0 +1,16 @@
+基础页面容器
+
+```
+<Container>
+  主体内容
+</Container>
+```
+
+使用 `slot`
+
+```
+<Container>
+  <template slot="header">我是插入到 header 中的内容</template>
+  主体内容
+</Container>
+```

static/markdownFiles/article/组件 - 页面容器.md

@@ -0,0 +1,23 @@
+## 参数
+
+| 参数名 | 介绍 | 必选 | 值类型 | 可选值 | 默认值 |
+| --- | --- | --- | --- | --- | --- |
+| type | 容器类型 | 非 | String | card ghost full-card | card |
+| responsive | 响应式宽度 | 非 | Boolean |  | false |
+
+> `responsive` 参数设置只在 `type` 等于 `card` 或 `ghost` 时生效
+
+## 使用方法
+
+基本
+
+```
+<template>
+  <Container>
+    <template slot="header">
+      header 内容
+    </template>
+    主体内容
+  </Container>
+</template>
+```