赞
踩
关于uni-app 开发 自定义tabbar的解决方式
1、首先新建组件tabBar.vue
- <template name="tabBar">
- <view class="tab-bar">
- <block v-for="(item,index) in tabBarList.list" >
- <navigator :url="item.pagePath" class="menu-item">
- <text>{
- {item.text}}</text>
- </navigator>
- </block>
- <view class="clear"></view>
- </view>
- </template>
-
-
- <style>
-
- .menu-item{
- width: 18%;
- float: left;
- text-align: center;
- padding-top: 5px;
- border: 0px solid #000000;
- font-size: 14px;
- }
- .clear{
- clear: both;
- }
- .tab-bar{
- position: fixed;
- width: 100%;
- left: 0px;
- bottom: 0px;
- padding: 0px 14px;
- }
- </style>
2、在APP.vue 添加如下方法
globalData: {
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。