Commit e069c7ae4e19b942a24422ca9ab6d0d7a8e7d2ac
1 parent
763ac47d
fixed #230
fixed #230
Showing
2 changed files
with
42 additions
and
49 deletions
Show diff stats
src/components/menu/menu.vue
| @@ -119,13 +119,15 @@ | @@ -119,13 +119,15 @@ | ||
| 119 | events: { | 119 | events: { |
| 120 | 'on-menu-item-select' (key) { | 120 | 'on-menu-item-select' (key) { |
| 121 | this.activeKey = key; | 121 | this.activeKey = key; |
| 122 | - this.updateActiveKey(); | ||
| 123 | this.$emit('on-select', key); | 122 | this.$emit('on-select', key); |
| 124 | } | 123 | } |
| 125 | }, | 124 | }, |
| 126 | watch: { | 125 | watch: { |
| 127 | openKeys () { | 126 | openKeys () { |
| 128 | this.$emit('on-open-change', this.openKeys); | 127 | this.$emit('on-open-change', this.openKeys); |
| 128 | + }, | ||
| 129 | + activeKey () { | ||
| 130 | + this.updateActiveKey(); | ||
| 129 | } | 131 | } |
| 130 | } | 132 | } |
| 131 | }; | 133 | }; |
test/routers/menu.vue
| 1 | <template> | 1 | <template> |
| 2 | - <div style="margin: 50px;position:relative;top: 0;left: 0;"> | ||
| 3 | - <Menu mode="horizontal" :theme="theme1" active-key="1"> | ||
| 4 | - <Menu-item key="1"> | ||
| 5 | - <Icon type="ios-paper"></Icon> | ||
| 6 | - 内容管理 | ||
| 7 | - </Menu-item> | ||
| 8 | - <Menu-item key="2"> | ||
| 9 | - <Icon type="ios-people"></Icon> | ||
| 10 | - 用户管理 | ||
| 11 | - </Menu-item> | ||
| 12 | - <Menu-item key="1"> | ||
| 13 | - <Icon type="ios-paper"></Icon> | ||
| 14 | - 内容管理 | ||
| 15 | - </Menu-item> | ||
| 16 | - <Menu-item key="2"> | ||
| 17 | - <Icon type="ios-people"></Icon> | ||
| 18 | - 用户管理 | ||
| 19 | - </Menu-item> | ||
| 20 | - <Menu-item key="1"> | ||
| 21 | - <Icon type="ios-paper"></Icon> | ||
| 22 | - 内容管理 | ||
| 23 | - </Menu-item> | ||
| 24 | - <Menu-item key="2"> | ||
| 25 | - <Icon type="ios-people"></Icon> | ||
| 26 | - 用户管理 | ||
| 27 | - </Menu-item> | ||
| 28 | - <Submenu key="3"> | ||
| 29 | - <template slot="title"> | ||
| 30 | - <Icon type="stats-bars"></Icon> | ||
| 31 | - 统计分析 | ||
| 32 | - </template> | ||
| 33 | - <Menu-group title="使用"> | ||
| 34 | - <Menu-item key="3-1">新增和新</Menu-item> | ||
| 35 | - <Menu-item key="3-2">活跃分析</Menu-item> | ||
| 36 | - <Menu-item key="3-3">时段分析</Menu-item> | ||
| 37 | - </Menu-group> | ||
| 38 | - <Menu-group title="留存"> | ||
| 39 | - <Menu-item key="3-4">用户留存</Menu-item> | ||
| 40 | - <Menu-item key="3-5">流失用户</Menu-item> | ||
| 41 | - </Menu-group> | ||
| 42 | - </Submenu> | ||
| 43 | - <Menu-item key="4"> | ||
| 44 | - <Icon type="settings"></Icon> | ||
| 45 | - 综合设置 | ||
| 46 | - </Menu-item> | ||
| 47 | - </Menu> | ||
| 48 | - </div> | 2 | + <Menu mode="horizontal" :theme="theme1" :active-key.sync="ak"> |
| 3 | + <Menu-item key="1"> | ||
| 4 | + <Icon type="ios-paper"></Icon> | ||
| 5 | + 内容管理 | ||
| 6 | + </Menu-item> | ||
| 7 | + <Menu-item key="2"> | ||
| 8 | + <Icon type="ios-people"></Icon> | ||
| 9 | + 用户管理 | ||
| 10 | + </Menu-item> | ||
| 11 | + <Submenu key="3"> | ||
| 12 | + <template slot="title"> | ||
| 13 | + <Icon type="stats-bars"></Icon> | ||
| 14 | + 统计分析 | ||
| 15 | + </template> | ||
| 16 | + <Menu-group title="使用"> | ||
| 17 | + <Menu-item key="3-1">新增和启动</Menu-item> | ||
| 18 | + <Menu-item key="3-2">活跃分析</Menu-item> | ||
| 19 | + <Menu-item key="3-3">时段分析</Menu-item> | ||
| 20 | + </Menu-group> | ||
| 21 | + <Menu-group title="留存"> | ||
| 22 | + <Menu-item key="3-4">用户留存</Menu-item> | ||
| 23 | + <Menu-item key="3-5">流失用户</Menu-item> | ||
| 24 | + </Menu-group> | ||
| 25 | + </Submenu> | ||
| 26 | + <Menu-item key="4"> | ||
| 27 | + <Icon type="settings"></Icon> | ||
| 28 | + 综合设置 | ||
| 29 | + </Menu-item> | ||
| 30 | + </Menu> | ||
| 31 | + <br> | ||
| 32 | + <p>切换主题</p> | ||
| 33 | + <Radio-group :model.sync="theme1"> | ||
| 34 | + <Radio value="light"></Radio> | ||
| 35 | + <Radio value="dark"></Radio> | ||
| 36 | + <Radio value="primary"></Radio> | ||
| 37 | + </Radio-group> | ||
| 38 | + <i-button @click="ak = '2'">change</i-button> | ||
| 49 | </template> | 39 | </template> |
| 50 | <script> | 40 | <script> |
| 51 | export default { | 41 | export default { |
| 52 | data () { | 42 | data () { |
| 53 | return { | 43 | return { |
| 54 | - theme1: 'light' | 44 | + theme1: 'light', |
| 45 | + ak: '1' | ||
| 55 | } | 46 | } |
| 56 | } | 47 | } |
| 57 | } | 48 | } |