mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-02-17 13:20:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: path in service-layout

Browse Source
This commit is contained in:
07akioni 2019-06-17 10:56:30 +08:00
parent 2610f0554b
commit 501829a682
3 changed files with 36 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
demo/components/sideMenuDemo.vue
View File

@ -5,30 +5,37 @@
name="已经不需要，一些挽留字句"
:items="[
{
name: '第一个服务'
name: '第一个服务',
path: '/n-nimbus-service-layout?param=666'
},
{
name: '第二个服务',
childItems: [
{
name: '二级菜单１'
name: '二级菜单１',
path: '/n-nimbus-service-layout?param=777'
},
{
name: '二级菜单2'
name: '二级菜单2',
path: '/n-nimbus-service-layout?param=888'
},
{
name: '二级菜单3'
name: '二级菜单3',
path: '/n-nimbus-service-layout?param=999'
},
{
name: '二级菜单4'
name: '二级菜单4',
path: '/n-nimbus-service-layout?param=000'
},
{
name: '二级菜单5'
name: '二级菜单5',
path: '/n-nimbus-service-layout?param=111'
}
]
},
{
name: '第三个服务'
name: '第三个服务',
path: '/n-nimbus-service-layout?param=222'
}
]"
>
@ -40,30 +47,37 @@
name="已经不需要，一些挽留字句"
:items="[
{
name: '第一个服务'
name: '第一个服务',
path: '/n-nimbus-service-layout?param=666'
},
{
name: '第二个服务',
childItems: [
{
name: '二级菜单１'
name: '二级菜单１',
path: '/n-nimbus-service-layout?param=777'
},
{
name: '二级菜单2'
name: '二级菜单2',
path: '/n-nimbus-service-layout?param=888'
},
{
name: '二级菜单3'
name: '二级菜单3',
path: '/n-nimbus-service-layout?param=999'
},
{
name: '二级菜单4'
name: '二级菜单4',
path: '/n-nimbus-service-layout?param=000'
},
{
name: '二级菜单5'
name: '二级菜单5',
path: '/n-nimbus-service-layout?param=111'
}
]
},
{
name: '第三个服务'
name: '第三个服务',
path: '/n-nimbus-service-layout?param=222'
}
]"
>

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "naive-ui",
"version": "0.1.22",
"version": "0.1.24",
"description": "",
"main": "index.js",
"scripts": {

11
packages/nimbus/ServiceLayout/src/main.vue
View File

@ -30,7 +30,7 @@
v-if="!item.childItems"
class="item"
:class="{ active: activeItemName === item.name }"
@click="makeActive(item.name)"
@click="makeActive(item)"
>
<span>{{ item.name }}</span>
</div>
@ -58,7 +58,7 @@
:key="childItem.name"
class="item is-group-item"
:class="{ active: activeItemName === childItem.name }"
@click="makeActive(childItem.name)"
@click="makeActive(childItem)"
>
<span>{{ childItem.name }}</span>
</div>
@ -103,8 +103,11 @@ export default {
toggle () {
this.isCollapsed = !this.isCollapsed
},
makeActive (itemName) {
this.activeItemName = itemName
makeActive (item) {
this.activeItemName = item.name
if (this.$router) {
this.$router.push(item.path)
}
},
toggleGroupHeaderCollapse (headerName) {
const headerIndex = this.itemsWithCollapseStatus.findIndex(item => item.name === headerName && item.childItems)