docs: component 文档分类
This commit is contained in:
		
							parent
							
								
									4f0e2f2ff9
								
							
						
					
					
						commit
						9a6244dfe8
					
				@ -1,20 +1,33 @@
 | 
				
			|||||||
<template>
 | 
					<template>
 | 
				
			||||||
      <lay-side>
 | 
					  <lay-side>
 | 
				
			||||||
    <ul class="layui-menu layui-menu-lg layui-menu-docs" style="padding: 8px">
 | 
					    <ul class="layui-menu layui-menu-lg layui-menu-docs" style="padding: 8px">
 | 
				
			||||||
      <li
 | 
					      <li
 | 
				
			||||||
        v-for="menu in menus"
 | 
					        v-for="menu in menus"
 | 
				
			||||||
        :key="menu"
 | 
					        :key="menu"
 | 
				
			||||||
        :class="[currentPath === menu.path ? 'layui-menu-item-checked2' : '']"
 | 
					        class="layui-menu-item-group"
 | 
				
			||||||
        @click="handleClick(menu)"
 | 
					        lay-options="{type: 'group', isAllowSpread: true}"
 | 
				
			||||||
      >
 | 
					      >
 | 
				
			||||||
        <div class="layui-menu-body-title">
 | 
					        <div class="layui-menu-body-title">{{ menu.title }}</div>
 | 
				
			||||||
          <router-link :to="menu.path">
 | 
					        <hr />
 | 
				
			||||||
            <span>{{ menu.title }}</span>
 | 
					        <ul>
 | 
				
			||||||
            <span class="layui-font-12 layui-font-gray">
 | 
					          <li
 | 
				
			||||||
              {{ menu.subTitle }}
 | 
					            v-for="children in menu.children"
 | 
				
			||||||
            </span>
 | 
					            :key="children"
 | 
				
			||||||
          </router-link>
 | 
					            :class="[
 | 
				
			||||||
        </div>
 | 
					              currentPath === children.path ? 'layui-menu-item-checked2' : '',
 | 
				
			||||||
 | 
					            ]"
 | 
				
			||||||
 | 
					            @click="handleClick(children)"
 | 
				
			||||||
 | 
					          >
 | 
				
			||||||
 | 
					            <div class="layui-menu-body-title">
 | 
				
			||||||
 | 
					              <router-link :to="children.path">
 | 
				
			||||||
 | 
					                <span>{{ children.title }}</span>
 | 
				
			||||||
 | 
					                <span class="layui-font-12 layui-font-gray">
 | 
				
			||||||
 | 
					                  {{ children.subTitle }}
 | 
				
			||||||
 | 
					                </span>
 | 
				
			||||||
 | 
					              </router-link>
 | 
				
			||||||
 | 
					            </div>
 | 
				
			||||||
 | 
					          </li>
 | 
				
			||||||
 | 
					        </ul>
 | 
				
			||||||
      </li>
 | 
					      </li>
 | 
				
			||||||
    </ul>
 | 
					    </ul>
 | 
				
			||||||
  </lay-side>
 | 
					  </lay-side>
 | 
				
			||||||
@ -46,232 +59,267 @@ export default {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
    const menus = [
 | 
					    const menus = [
 | 
				
			||||||
      {
 | 
					      {
 | 
				
			||||||
        id: 4,
 | 
					        id: 1,
 | 
				
			||||||
 | 
					        title: '通用',
 | 
				
			||||||
 | 
					        children: [
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 20,
 | 
				
			||||||
 | 
					            title: '颜色',
 | 
				
			||||||
 | 
					            subTitle: 'color',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/color',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 6,
 | 
				
			||||||
 | 
					            title: '按钮',
 | 
				
			||||||
 | 
					            subTitle: 'button',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/button',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 7,
 | 
				
			||||||
 | 
					            title: '图标',
 | 
				
			||||||
 | 
					            subTitle: 'iconfont',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/icon',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 10,
 | 
				
			||||||
 | 
					            title: '动画',
 | 
				
			||||||
 | 
					            subTitle: 'animation',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/animation',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					        ],
 | 
				
			||||||
 | 
					      },
 | 
				
			||||||
 | 
					      {
 | 
				
			||||||
 | 
					        id: 1,
 | 
				
			||||||
        title: '布局',
 | 
					        title: '布局',
 | 
				
			||||||
        subTitle: 'layout',
 | 
					        children: [
 | 
				
			||||||
        path: '/zh-CN/components/layout',
 | 
					          {
 | 
				
			||||||
 | 
					            id: 4,
 | 
				
			||||||
 | 
					            title: '布局',
 | 
				
			||||||
 | 
					            subTitle: 'layout',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/layout',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 5,
 | 
				
			||||||
 | 
					            title: '容器',
 | 
				
			||||||
 | 
					            subTitle: 'container',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/container',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 11,
 | 
				
			||||||
 | 
					            title: '栅格',
 | 
				
			||||||
 | 
					            subTitle: 'grid',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/grid',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 8,
 | 
				
			||||||
 | 
					            title: '面板',
 | 
				
			||||||
 | 
					            subTitle: 'panel',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/panel',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 9,
 | 
				
			||||||
 | 
					            title: '卡片',
 | 
				
			||||||
 | 
					            subTitle: 'card',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/card',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					        ],
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      {
 | 
					      {
 | 
				
			||||||
        id: 5,
 | 
					        id: 1,
 | 
				
			||||||
        title: '容器',
 | 
					        title: '导航',
 | 
				
			||||||
        subTitle: 'container',
 | 
					        children: [
 | 
				
			||||||
        path: '/zh-CN/components/container',
 | 
					          {
 | 
				
			||||||
 | 
					            id: 16,
 | 
				
			||||||
 | 
					            title: '菜单',
 | 
				
			||||||
 | 
					            subTitle: 'nav',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/menu',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 17,
 | 
				
			||||||
 | 
					            title: '面包屑',
 | 
				
			||||||
 | 
					            subTitle: 'breadcrumb',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/breadcrumb',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 28,
 | 
				
			||||||
 | 
					            title: '选项卡',
 | 
				
			||||||
 | 
					            subTitle: 'tab',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/tab',
 | 
				
			||||||
 | 
					          },          {
 | 
				
			||||||
 | 
					            id: 27,
 | 
				
			||||||
 | 
					            title: '下拉菜单',
 | 
				
			||||||
 | 
					            subTitle: 'dropdown',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/dropdown',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					        ],
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      {
 | 
					      {
 | 
				
			||||||
        id: 6,
 | 
					        id: 1,
 | 
				
			||||||
        title: '按钮',
 | 
					        title: '辅助',
 | 
				
			||||||
        subTitle: 'button',
 | 
					        children: [
 | 
				
			||||||
        path: '/zh-CN/components/button',
 | 
					          {
 | 
				
			||||||
 | 
					            id: 13,
 | 
				
			||||||
 | 
					            title: '徽章',
 | 
				
			||||||
 | 
					            subTitle: 'badge',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/badge',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 14,
 | 
				
			||||||
 | 
					            title: '区块',
 | 
				
			||||||
 | 
					            subTitle: 'block',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/block',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 15,
 | 
				
			||||||
 | 
					            title: '分割',
 | 
				
			||||||
 | 
					            subTitle: 'line',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/line',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 24,
 | 
				
			||||||
 | 
					            title: '字段',
 | 
				
			||||||
 | 
					            subTitle: 'field',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/field',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					        ],
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      {
 | 
					      {
 | 
				
			||||||
        id: 7,
 | 
					        id: 1,
 | 
				
			||||||
        title: '图标',
 | 
					 | 
				
			||||||
        subTitle: 'iconfont',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/icon',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 8,
 | 
					 | 
				
			||||||
        title: '面板',
 | 
					 | 
				
			||||||
        subTitle: 'panel',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/panel',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 9,
 | 
					 | 
				
			||||||
        title: '卡片',
 | 
					 | 
				
			||||||
        subTitle: 'card',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/card',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 10,
 | 
					 | 
				
			||||||
        title: '动画',
 | 
					 | 
				
			||||||
        subTitle: 'animation',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/animation',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 11,
 | 
					 | 
				
			||||||
        title: '栅格',
 | 
					 | 
				
			||||||
        subTitle: 'grid',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/grid',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 12,
 | 
					 | 
				
			||||||
        title: '表单',
 | 
					        title: '表单',
 | 
				
			||||||
        subTitle: 'form',
 | 
					        children: [
 | 
				
			||||||
        path: '/zh-CN/components/form',
 | 
					          {
 | 
				
			||||||
 | 
					            id: 32,
 | 
				
			||||||
 | 
					            title: '复选框',
 | 
				
			||||||
 | 
					            subTitle: 'checkbox',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/checkbox',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 33,
 | 
				
			||||||
 | 
					            title: '单选框',
 | 
				
			||||||
 | 
					            subTitle: 'radio',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/radio',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 34,
 | 
				
			||||||
 | 
					            title: '输入框',
 | 
				
			||||||
 | 
					            subTitle: 'input',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/input',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 35,
 | 
				
			||||||
 | 
					            title: '文本域',
 | 
				
			||||||
 | 
					            subTitle: 'textarea',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/textarea',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 36,
 | 
				
			||||||
 | 
					            title: '开关',
 | 
				
			||||||
 | 
					            subTitle: 'switch',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/switch',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 39,
 | 
				
			||||||
 | 
					            title: '下拉选择',
 | 
				
			||||||
 | 
					            subTitle: 'select',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/select',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 29,
 | 
				
			||||||
 | 
					            title: '图标选择',
 | 
				
			||||||
 | 
					            subTitle: 'iconPicker',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/iconPicker',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 40,
 | 
				
			||||||
 | 
					            title: '颜色选择器',
 | 
				
			||||||
 | 
					            subTitle: 'colorPicker',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/colorPicker',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 26,
 | 
				
			||||||
 | 
					            title: '评分',
 | 
				
			||||||
 | 
					            subTitle: 'rate',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/rate',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 37,
 | 
				
			||||||
 | 
					            title: '滑块',
 | 
				
			||||||
 | 
					            subTitle: 'slider',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/slider',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					          {
 | 
				
			||||||
 | 
					            id: 12,
 | 
				
			||||||
 | 
					            title: '表单',
 | 
				
			||||||
 | 
					            subTitle: 'form',
 | 
				
			||||||
 | 
					            path: '/zh-CN/components/form',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					        ],
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      {
 | 
					      {
 | 
				
			||||||
        id: 13,
 | 
					        id: 1,
 | 
				
			||||||
        title: '徽章',
 | 
					        title: '展示',
 | 
				
			||||||
        subTitle: 'badge',
 | 
					        children: [
 | 
				
			||||||
        path: '/zh-CN/components/badge',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 18,
 | 
				
			||||||
      {
 | 
					            title: '进度',
 | 
				
			||||||
        id: 14,
 | 
					            subTitle: 'progress',
 | 
				
			||||||
        title: '区块',
 | 
					            path: '/zh-CN/components/progress',
 | 
				
			||||||
        subTitle: 'block',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/block',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 19,
 | 
				
			||||||
      {
 | 
					            title: '时间线',
 | 
				
			||||||
        id: 15,
 | 
					            subTitle: 'timeline',
 | 
				
			||||||
        title: '分割',
 | 
					            path: '/zh-CN/components/timeline',
 | 
				
			||||||
        subTitle: 'line',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/line',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 21,
 | 
				
			||||||
      {
 | 
					            title: '手风琴',
 | 
				
			||||||
        id: 16,
 | 
					            subTitle: 'collapse',
 | 
				
			||||||
        title: '菜单',
 | 
					            path: '/zh-CN/components/collapse',
 | 
				
			||||||
        subTitle: 'nav',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/menu',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 22,
 | 
				
			||||||
      {
 | 
					            title: '表格',
 | 
				
			||||||
        id: 17,
 | 
					            subTitle: 'table',
 | 
				
			||||||
        title: '面包屑',
 | 
					            path: '/zh-CN/components/table',
 | 
				
			||||||
        subTitle: 'breadcrumb',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/breadcrumb',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 23,
 | 
				
			||||||
      {
 | 
					            title: '头像',
 | 
				
			||||||
        id: 18,
 | 
					            subTitle: 'avatar',
 | 
				
			||||||
        title: '进度',
 | 
					            path: '/zh-CN/components/avatar',
 | 
				
			||||||
        subTitle: 'progress',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/progress',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 25,
 | 
				
			||||||
      {
 | 
					            title: '空',
 | 
				
			||||||
        id: 19,
 | 
					            subTitle: 'empty',
 | 
				
			||||||
        title: '时间线',
 | 
					            path: '/zh-CN/components/empty',
 | 
				
			||||||
        subTitle: 'timeline',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/timeline',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 29,
 | 
				
			||||||
      {
 | 
					            title: '分页',
 | 
				
			||||||
        id: 20,
 | 
					            subTitle: 'page',
 | 
				
			||||||
        title: '颜色',
 | 
					            path: '/zh-CN/components/page',
 | 
				
			||||||
        subTitle: 'color',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/color',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 30,
 | 
				
			||||||
      {
 | 
					            title: '树形组件',
 | 
				
			||||||
        id: 21,
 | 
					            subTitle: 'tree',
 | 
				
			||||||
        title: '手风琴',
 | 
					            path: '/zh-CN/components/tree',
 | 
				
			||||||
        subTitle: 'collapse',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/collapse',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 31,
 | 
				
			||||||
      {
 | 
					            title: '穿梭框',
 | 
				
			||||||
        id: 22,
 | 
					            subTitle: 'transfer',
 | 
				
			||||||
        title: '表格',
 | 
					            path: '/zh-CN/components/transfer',
 | 
				
			||||||
        subTitle: 'table',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/table',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 38,
 | 
				
			||||||
      {
 | 
					            title: '轮播',
 | 
				
			||||||
        id: 23,
 | 
					            subTitle: 'carousel',
 | 
				
			||||||
        title: '头像',
 | 
					            path: '/zh-CN/components/carousel',
 | 
				
			||||||
        subTitle: 'avatar',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/components/avatar',
 | 
					        ],
 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 24,
 | 
					 | 
				
			||||||
        title: '字段',
 | 
					 | 
				
			||||||
        subTitle: 'field',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/field',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 25,
 | 
					 | 
				
			||||||
        title: '空',
 | 
					 | 
				
			||||||
        subTitle: 'empty',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/empty',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 26,
 | 
					 | 
				
			||||||
        title: '评分',
 | 
					 | 
				
			||||||
        subTitle: 'rate',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/rate',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 27,
 | 
					 | 
				
			||||||
        title: '下拉菜单',
 | 
					 | 
				
			||||||
        subTitle: 'dropdown',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/dropdown',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 28,
 | 
					 | 
				
			||||||
        title: '选项卡',
 | 
					 | 
				
			||||||
        subTitle: 'tab',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/tab',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 29,
 | 
					 | 
				
			||||||
        title: '图标选择',
 | 
					 | 
				
			||||||
        subTitle: 'iconPicker',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/iconPicker',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 29,
 | 
					 | 
				
			||||||
        title: '分页',
 | 
					 | 
				
			||||||
        subTitle: 'page',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/page',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 30,
 | 
					 | 
				
			||||||
        title: '树形组件',
 | 
					 | 
				
			||||||
        subTitle: 'tree',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/tree',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 31,
 | 
					 | 
				
			||||||
        title: '穿梭框',
 | 
					 | 
				
			||||||
        subTitle: 'transfer',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/transfer',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 32,
 | 
					 | 
				
			||||||
        title: '复选框',
 | 
					 | 
				
			||||||
        subTitle: 'checkbox',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/checkbox',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 33,
 | 
					 | 
				
			||||||
        title: '单选框',
 | 
					 | 
				
			||||||
        subTitle: 'radio',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/radio',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 34,
 | 
					 | 
				
			||||||
        title: '输入框',
 | 
					 | 
				
			||||||
        subTitle: 'input',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/input',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 35,
 | 
					 | 
				
			||||||
        title: '文本域',
 | 
					 | 
				
			||||||
        subTitle: 'textarea',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/textarea',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 36,
 | 
					 | 
				
			||||||
        title: '开关',
 | 
					 | 
				
			||||||
        subTitle: 'switch',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/switch',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 37,
 | 
					 | 
				
			||||||
        title: '滑块',
 | 
					 | 
				
			||||||
        subTitle: 'slider',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/slider',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 38,
 | 
					 | 
				
			||||||
        title: '轮播',
 | 
					 | 
				
			||||||
        subTitle: 'carousel',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/carousel',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 39,
 | 
					 | 
				
			||||||
        title: '下拉选择',
 | 
					 | 
				
			||||||
        subTitle: 'select',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/select',
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      {
 | 
					 | 
				
			||||||
        id: 40,
 | 
					 | 
				
			||||||
        title: '颜色选择器',
 | 
					 | 
				
			||||||
        subTitle: 'colorPicker',
 | 
					 | 
				
			||||||
        path: '/zh-CN/components/colorPicker',
 | 
					 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
    ]
 | 
					    ]
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
				
			|||||||
@ -4,17 +4,30 @@
 | 
				
			|||||||
      <li
 | 
					      <li
 | 
				
			||||||
        v-for="menu in menus"
 | 
					        v-for="menu in menus"
 | 
				
			||||||
        :key="menu"
 | 
					        :key="menu"
 | 
				
			||||||
        :class="[currentPath === menu.path ? 'layui-menu-item-checked2' : '']"
 | 
					        class="layui-menu-item-group"
 | 
				
			||||||
        @click="handleClick(menu)"
 | 
					        lay-options="{type: 'group', isAllowSpread: true}"
 | 
				
			||||||
      >
 | 
					      >
 | 
				
			||||||
        <div class="layui-menu-body-title">
 | 
					        <div class="layui-menu-body-title">{{ menu.title }}</div>
 | 
				
			||||||
          <router-link :to="menu.path">
 | 
					        <hr />
 | 
				
			||||||
            <span>{{ menu.title }}</span>
 | 
					        <ul>
 | 
				
			||||||
            <span class="layui-font-12 layui-font-gray">
 | 
					          <li
 | 
				
			||||||
              {{ menu.subTitle }}
 | 
					            v-for="children in menu.children"
 | 
				
			||||||
            </span>
 | 
					            :key="children"
 | 
				
			||||||
          </router-link>
 | 
					            :class="[
 | 
				
			||||||
        </div>
 | 
					              currentPath === children.path ? 'layui-menu-item-checked2' : '',
 | 
				
			||||||
 | 
					            ]"
 | 
				
			||||||
 | 
					            @click="handleClick(children)"
 | 
				
			||||||
 | 
					          >
 | 
				
			||||||
 | 
					            <div class="layui-menu-body-title">
 | 
				
			||||||
 | 
					              <router-link :to="children.path">
 | 
				
			||||||
 | 
					                <span>{{ children.title }}</span>
 | 
				
			||||||
 | 
					                <span class="layui-font-12 layui-font-gray">
 | 
				
			||||||
 | 
					                  {{ children.subTitle }}
 | 
				
			||||||
 | 
					                </span>
 | 
				
			||||||
 | 
					              </router-link>
 | 
				
			||||||
 | 
					            </div>
 | 
				
			||||||
 | 
					          </li>
 | 
				
			||||||
 | 
					        </ul>
 | 
				
			||||||
      </li>
 | 
					      </li>
 | 
				
			||||||
    </ul>
 | 
					    </ul>
 | 
				
			||||||
  </lay-side>
 | 
					  </lay-side>
 | 
				
			||||||
@ -47,21 +60,27 @@ export default {
 | 
				
			|||||||
    const menus = [
 | 
					    const menus = [
 | 
				
			||||||
      {
 | 
					      {
 | 
				
			||||||
        id: 1,
 | 
					        id: 1,
 | 
				
			||||||
        title: '介绍',
 | 
					        title: '基础',
 | 
				
			||||||
        subTitle: 'introduce',
 | 
					        children: [
 | 
				
			||||||
        path: '/zh-CN/guide/introduce',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 1,
 | 
				
			||||||
      {
 | 
					            title: '介绍',
 | 
				
			||||||
        id: 2,
 | 
					            subTitle: 'introduce',
 | 
				
			||||||
        title: '安装',
 | 
					            path: '/zh-CN/guide/introduce',
 | 
				
			||||||
        subTitle: 'get started',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/guide/getStarted',
 | 
					          {
 | 
				
			||||||
      },
 | 
					            id: 2,
 | 
				
			||||||
      {
 | 
					            title: '安装',
 | 
				
			||||||
        id: 3,
 | 
					            subTitle: 'get started',
 | 
				
			||||||
        title: '更新',
 | 
					            path: '/zh-CN/guide/getStarted',
 | 
				
			||||||
        subTitle: 'change log',
 | 
					          },
 | 
				
			||||||
        path: '/zh-CN/guide/changelog',
 | 
					          {
 | 
				
			||||||
 | 
					            id: 3,
 | 
				
			||||||
 | 
					            title: '更新',
 | 
				
			||||||
 | 
					            subTitle: 'change log',
 | 
				
			||||||
 | 
					            path: '/zh-CN/guide/changelog',
 | 
				
			||||||
 | 
					          },
 | 
				
			||||||
 | 
					        ],
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
    ]
 | 
					    ]
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user