微信小程序自定义tabbar和picker的问题

最新推荐文章于 2024-04-23 10:07:09 发布

Amy_Chen_White

最新推荐文章于 2024-04-23 10:07:09 发布

阅读量298

点赞数

文章标签：微信小程序小程序

本文链接：https://blog.csdn.net/weixin_43758938/article/details/128285111

版权

!](https://img-blog.csdnimg.cn/f64f339ac12845dba534752b43d2f029.png)

如果使用tabbar和picker就会产生上述的样式

https://developers.weixin.qq.com/community/develop/article/doc/00080a2a0f40d06d78ce80f7a56c13
可以参考这个链接

简单来说就是当你点击picker的时候tabbar进行隐藏

tabbar组件：

在这里插入图片描述

使用picker的页面：

在这里插入图片描述

  <picker mode="region"  bindcancel="dcancel"  bindchange="RegionChange" name="cityName" value="{{region}}" custom-item="{{customItem}}">
     <view class="picker"  bindtap="dechange">
          {{region[0]}}，{{region[1]}}，{{region[2]}}
      </view>
  </picker>

dechange() {
    this.getTabBar().setData({
      showBar: false
    })
  },
  dcancel() {
    console.log("取消了")
    this.getTabBar().setData({
      showBar: true
    })
  },
  RegionChange: function (e) {
    this.setData({
      region: e.detail.value
    })
    this.getTabBar().setData({
      showBar: true
    })
  },