Commit c708835c0c80340d3dedbc35872d7591d55364f1

Authored by 梁灏
1 parent 9212149e

update Menu to support SSR

Showing 2 changed files with 33 additions and 24 deletions   Show diff stats
examples/routers/menu.vue
1 1 <template>
2 2 <div>
3   - <Menu :theme="theme3" active-name="1">
4   - <Menu-group title="内容管理">
5   - <Menu-item name="1">
6   - <Icon type="document-text"></Icon>
7   - 文章管理
8   - </Menu-item>
9   - <Menu-item name="2">
10   - <Icon type="chatbubbles"></Icon>
11   - 评论管理
12   - </Menu-item>
13   - </Menu-group>
14   - <Menu-group title="统计分析">
15   - <Menu-item name="3">
16   - <Icon type="heart"></Icon>
17   - 用户留存
18   - </Menu-item>
19   - <Menu-item name="4">
20   - <Icon type="heart-broken"></Icon>
21   - 流失用户
22   - </Menu-item>
23   - </Menu-group>
  3 + <Menu mode="horizontal" :theme="theme1" active-name="1">
  4 + <Menu-item name="1">
  5 + <Icon type="ios-paper"></Icon>
  6 + 内容管理
  7 + </Menu-item>
  8 + <Menu-item name="2">
  9 + <Icon type="ios-people"></Icon>
  10 + 用户管理
  11 + </Menu-item>
  12 + <Submenu name="3">
  13 + <template slot="title">
  14 + <Icon type="stats-bars"></Icon>
  15 + 统计分析
  16 + </template>
  17 + <Menu-group title="使用">
  18 + <Menu-item name="3-1">新增和启动</Menu-item>
  19 + <Menu-item name="3-2">活跃分析</Menu-item>
  20 + <Menu-item name="3-3">时段分析</Menu-item>
  21 + </Menu-group>
  22 + <Menu-group title="留存">
  23 + <Menu-item name="3-4">用户留存</Menu-item>
  24 + <Menu-item name="3-5">流失用户</Menu-item>
  25 + </Menu-group>
  26 + </Submenu>
  27 + <Menu-item name="4">
  28 + <Icon type="settings"></Icon>
  29 + 综合设置
  30 + </Menu-item>
24 31 </Menu>
25 32 <br>
26 33 <p>切换主题</p>
27   - <Radio-group v-model="theme3">
  34 + <Radio-group v-model="theme1">
28 35 <Radio label="light"></Radio>
29 36 <Radio label="dark"></Radio>
  37 + <Radio label="primary"></Radio>
30 38 </Radio-group>
31 39 </div>
32 40 </template>
... ... @@ -34,7 +42,7 @@
34 42 export default {
35 43 data () {
36 44 return {
37   - theme3: 'light'
  45 + theme1: 'light'
38 46 }
39 47 }
40 48 }
... ...
src/components/menu/submenu.vue
... ... @@ -12,7 +12,8 @@
12 12 v-show="opened"
13 13 placement="bottom"
14 14 ref="drop"
15   - :style="dropStyle"><slot></slot></Drop>
  15 + :style="dropStyle"><ul><slot></slot></ul>
  16 + </Drop>
16 17 </transition>
17 18 </li>
18 19 </template>
... ...