9a543af7
liuqimichale
经典案例 目录建立
|
1
|
<template>
|
9cb902b2
liuqimichale
解决方案
|
2
|
<div class="" >
|
0c75b35c
liuqimichale
经典案例 目录建立
|
3
4
5
6
7
8
9
10
11
12
13
|
<commonBanner mainTitle="中兴智能交通" subTitle="构建绿色交通 享受安全便利出行"></commonBanner>
<div class="tab-wrapper">
<ul class="tab-main widthCommon">
<li
v-for="(item, index) in tabData"
:key="item"
@click="changeTab(index,item)"
:class="{tabActive:currentIndex==index}"
>{{item}}</li>
</ul>
</div>
|
f7dec07d
liuqimichale
经典案例 列表
|
14
15
16
17
18
19
20
|
<div class="bread ">
<div class=" widthCommon">
您所在位置: <span class="pointer" @click="$router.push({name:'home'})">首页</span> -> 经典案例 -> {{name}}
</div>
</div>
|
1e0bb6b5
liuqimichale
经典案例 完成
|
21
22
23
24
25
|
<div class="widthCommon">
<keep-alive>
<component :is="tabView"></component>
</keep-alive>
</div>
|
f7dec07d
liuqimichale
经典案例 列表
|
26
|
|
f7dec07d
liuqimichale
经典案例 列表
|
27
|
|
f7dec07d
liuqimichale
经典案例 列表
|
28
|
|
0c75b35c
liuqimichale
经典案例 目录建立
|
29
|
</div>
|
9a543af7
liuqimichale
经典案例 目录建立
|
30
31
32
|
</template>
<script>
|
0c75b35c
liuqimichale
经典案例 目录建立
|
33
34
35
36
|
import commonBanner from '@/components/commonBanner'
import selectTab0 from './components/selectTab0'
import selectTab1 from './components/selectTab1'
import selectTab2 from './components/selectTab2'
|
9a543af7
liuqimichale
经典案例 目录建立
|
37
|
export default {
|
0c75b35c
liuqimichale
经典案例 目录建立
|
38
39
40
41
42
43
44
|
name: 'index',
components:{
commonBanner, selectTab0, selectTab1, selectTab2
},
data(){
return{
tabData:[
|
f7dec07d
liuqimichale
经典案例 列表
|
45
|
'智慧停车','公安交通','公共交通'
|
0c75b35c
liuqimichale
经典案例 目录建立
|
46
47
48
|
],
currentIndex:0,
tabView:'selectTab0',
|
f7dec07d
liuqimichale
经典案例 列表
|
49
|
name:'智慧停车'
|
0c75b35c
liuqimichale
经典案例 目录建立
|
50
51
52
53
54
55
56
57
|
}
},
methods:{
changeTab:function (index,item) {
console.log(index)
this.currentIndex = index
this.tabView = 'selectTab'+index
this.name = item
|
f7dec07d
liuqimichale
经典案例 列表
|
58
59
60
61
|
},
pagePhotoChange:function (pInfo) {
console.log(pInfo)
},
|
0c75b35c
liuqimichale
经典案例 目录建立
|
62
|
}
|
9a543af7
liuqimichale
经典案例 目录建立
|
63
64
65
66
|
}
</script>
<style scoped lang="scss">
|
1e0bb6b5
liuqimichale
经典案例 完成
|
67
|
|
9a543af7
liuqimichale
经典案例 目录建立
|
68
|
</style>
|