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
68
69
70
| <template>
| <view>
| <view class="tabBar_css">
| <u-tabbar
| :value="currentPagePath"
| :fixed="false"
| :placeholder="false"
| :safeAreaInsetBottom="false"
| activeColor="#48bff4"
| >
| <u-tabbar-item v-for="(item, index) in tabBarList"
| :key="index"
| :text="item.text"
| :name="item.pagePath"
| @click="click_page"
| >
| <image class="u-page__item__slot-icon" slot="inactive-icon" :src="item.iconPath"></image>
| <image class="u-page__item__slot-icon" slot="active-icon" :src="item.selectedIconPath"></image>
| </u-tabbar-item>
| </u-tabbar>
| </view>
| </view>
| </template>
|
| <script>
| import {mapGetters} from 'vuex'
| import store from '@/store/index.js'
| export default {
| name:"tabBar",
| props: {
| currentPagePath: String,
| tabBarList: {
| default: function() {
| return uni.getStorageSync('tabBarList')
| }
| },
| },
| data() {
| return {
| }
| },
| mounted(){
|
| },
| methods: {
| click_page(item){
| let page = '/' + item;
| console.log("跳转",item)
| uni.reLaunch({
| url: page
| })
| }
| }
| }
| </script>
|
| <style>
| .tabBar_css{
| position: fixed;
| bottom: 0;
| background-color: red;
| z-index: 9999;
| width: 100%;
| box-shadow: 0 -3px 12px rgba(0,0,0,0.05);
| }
| .u-page__item__slot-icon{
| width: 22px;
| height: 22px;
| }
| </style>
|
|
