Blame view

components/TabBar/TabBar.vue 2.56 KB
c7add6cf   “wangming”   初始版本开发完毕
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
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
  <template>
  	<view class="page-total">
  		<view class="tab-list">

  			<view class="list" v-for="(item,index) in TabBarList" 

  			@click="onTabBar(item,index)"

  			:key="index">

  				<image :src="item.acImg" mode="widthFix" v-show="tabBarShow === index"></image>

  				<image :src="item.img" mode="widthFix" v-show="tabBarShow != index"></image>

  				<text :class="{'action':tabBarShow===index}">{{item.name}}</text>

  			</view>

  		</view>
  	</view>
  </template>
  
  <script>
  	export default {
  		data() {
  			return {
  				TabBarList:[

  					{

  						index: 0,

  						name: '首页',

  						img: '/static/tabBar/tab_01.png',

  						acImg: '/static/tabBar/tab_02.png'

  					},

  					{

  						index: 1,

  						name: '政策资讯',

  						img: '/static/tabBar/tab_05.png',

  						acImg: '/static/tabBar/tab_06.png'

  					},

  					{

  						index: 2,

  						name: '企业产品',

  						img: '/static/tabBar/tab_07.png',

  						acImg: '/static/tabBar/tab_08.png'

  					},

  					{

  						index: 3,

  						name: '我的',

  						img: '/static/tabBar/tab_09.png',

  						acImg: '/static/tabBar/tab_10.png'

  					},

  				],
  				codeheight: 0,

  				isOverall: 0,

  				phoneModel: '',

  			};
  		},

  		props:{

  			tabBarShow: {

  				type: Number,

  				default: 0,

  			}

  		},

  		mounted() {

  			try {

  			    const res = uni.getSystemInfoSync();

  					let that = this;

  			    // 获取系统信息

  			    uni.getSystemInfo({

  			    	success(res) {

  			    		console.log(res.brand) //手机牌子

  			    		console.log(res.model) //手机型号

  			    		console.log(res.screenWidth) //屏幕宽度

  			    		console.log(res.screenHeight) //屏幕高度

  							that.codeheight = Math.round(res.screenHeight);

  							that.phoneModel =res.model

  							if(res.model.search('iPhone')){

  								that.isOverall = 0;

  							}else if(Math.round(res.screenHeight)>740){

  							 that.isOverall = 1;

  							}

  							console.log(that.isOverall);

  			    	}

  			    });

  			} catch (e) {

  			    // error

  			}

  		},

  		methods:{

  			/**

  			 * @param {Object} item

  			 * @param {Number} index

  			 */

  			onTabBar(item,index){

  				// this.tabBarShow = index;

  				switch (index){

  					case 0:

  						wx.switchTab({

  							url:'/pages/home/home'

  						})

  						break;

  					case 1:

  						wx.switchTab({

  							url:'/pages/discover/discover'

  						})

  						break;

  					case 2:

  						wx.switchTab({

  							url:'/pages/cart/cart'

  						})

  						break;

  					case 3:

  						wx.switchTab({

  							url:'/pages/my/my'

  						})

  						break;

  				}

  			}

  		}
  	}
  </script>
  
  <style scoped lang="scss">

  	@import 'TabBar.scss';
  </style>