bottomNav.vue
2.14 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<template>
<div class="nav-bottom">
<div class="nav-bottom-home">
<img src="../../static/images/home.svg" style="width:0.55rem;margin-top:0.2rem;"/>
</div>
<ul class="nav-bottom-table">
<template v-for="(item, index) in groupNav.navList">
<li v-if="item.subMenu" class="nav-tablecell" @click="showSecond(index,item)">
<div class="nav-first">{{item.name}}</div>
<ul class="nav-second hide" v-if="item.subMenu">
<li class="nav-second-item" v-for="subitem in item.subMenu"
@click="gotopage(subitem.prefix,subitem.url)">{{subitem.name}}
</li>
</ul>
</li>
<router-link :to="item.prefix.url" class="nav-tablecell" @click="gotopage(item.prefix,item.url)" v-else
tag="li">
<div class="nav-first">{{item.name}}</div>
</router-link>
</template>
</ul>
</div>
</template>
<style>
</style>
<script type="text/ecmascript-6">
import {getgroupNav} from '../../vuex/actions';
import {goto} from '../../utils/commonUtil';
export default {
data(){
return {
showlist: false,
linkActiveurl: [],
}
},
mounted(){
this.getgroupNav();
},
methods: {
showSecond(index, item){
if ($(".nav-second").eq(index).hasClass('hide')) {
$(".nav-second").addClass('hide');
$(".nav-second").eq(index).removeClass('hide')
} else {
$(".nav-second").eq(index).addClass('hide')
}
},
gotopage(type, url){
goto.gotopage(this, type, url);
},
},
vuex: {
getters: {
groupNav: ({weiPageData}) => {
return weiPageData.groupNav;
},
},
actions: {
getgroupNav
}
},
}
</script>