setTabBarBadge在非tabBar页面设置

不支持，需要在tabBar栏操作。

可以换种思路，在本页面遮罩层实现业务逻辑，这样没有离开tabBar页面，就可以操作setTabBarBadge。

wxml 添加到主页面最下面即可

<!-- 遮罩层 -->
<!-- <view class="shadow" wx:if="{{chooseSize}}" bindtap='hideModal'></view> -->
<!-- 上滑高度 -->
<view class='choosen' wx:if="{{chooseSize}}" animation='{{animationData}}'>
  <!-- 内容 -->
  <view class="container-box">
    <view class="close">
      <image src="/images/close.png" bindtap="hideModal"></image>
    </view>
    <view class="picture">
      <image src="{{detail.imageUrl}}"></image>
    </view>
    <view class="detail_leg">
      <view class="dish">{{detail.name}}</view>
      <view class="Sold">已售{{detail.number}}份</view>
      <view class="price">
        <text>￥{{detail.real}}</text>
        <text style="font-size: 20rpx;text-decoration: line-through;color:#000;">￥{{detail.price}}</text>
        <image src="/images/add.png" data-id="{{detail.id}}" bindtap="detailAddCarts"></image>
      </view>
    </view>
  </view>
</view>

wxss 

/*弹窗*/
/* .shadow{
  width: 100%;
  height: 200%;
  z-index: 80;
  position: absolute;
  top: 0;
  background-color: #000;
  opacity: 0.5;
} */
/* 上滑高度 */
.choosen{
  width: 100%;
  height: 100%;
  position: fixed;
  bottom: 0;
  background-color: #fff;
  /* border-top-left-radius: 20rpx;
  border-top-right-radius: 20rpx; */
  z-index: 98;
}

/* 内容 */
.container-box {
  display: flex;
  height: 100%;
  flex-direction: column;
  width: 100%;
  border-radius: 15rpx;
  margin: 0 auto;
  z-index: 98;
}

.close{
  position: fixed;
  right: 30rpx;
  top: 30rpx;
}
.close image{
  height: 60rpx;
  width: 60rpx;
}

.picture{
  height: 60%;
  width: 100%;

}
.picture image{
  height: 100%;
  width: 100%;
}

.dish{
  font-size: 48rpx;
  font-weight: bold;
}
.Sold{
  margin-top: 10rpx;
  font-size: 20rpx;
}
.price{
  margin-top: 10rpx;
  color: red;
}
.price image{
  height: 50rpx;
  width: 50rpx;
  position: fixed;
  right: 40rpx;
}

js

 detailAddCarts: function (event) {
    let productId = this.data.productId
    console.log(this.data);
    let product = this.data.products.find(element => element.id == productId); //根据id获取商品数据
    // let product = this.data.products.find(detail); //根据id获取商品数据
    console.log(product)
    //检测购物车中是否已经存在某个商品
    if (this.data.carts.includes(product)) {
      this.data.carts.find(element => element.id == productId).count++; //不添加商品，直接数量加1
    } else {
      this.data.carts.push(product); //添加商品
    }
    app.globalData.carts = this.data.carts;
    console.log(app.globalData.carts);
    wx.setTabBarBadge({
      index: 2,
      text: app.globalData.carts.length.toString()
    })
  },


  //商品详情页是上滑
  showshadow: function(e) {
    let productId_detail = e.currentTarget.dataset.id; //获取商品id
    let product_detail = this.data.products.find(element => element.id == productId_detail); //根据id获取商品数据
    console.log(product_detail)
    var _that = this;
    _that.setData({
      detail: product_detail,
      productId: productId_detail,
    })

    if (this.data.chooseSize == false) {
      this.chooseSezi()
    } else {
      this.hideModal()
    }
  },

  // 动画函数
  chooseSezi: function(e) {
    // 用that取代this，防止不必要的情况发生
    var that = this;
    // 创建一个动画实例
    var animation = wx.createAnimation({
      // 动画持续时间
      duration: 400,
      // 定义动画效果，当前是匀速
      timingFunction: 'linear'
    })
    // 将该变量赋值给当前动画
    that.animation = animation
    // 先在y轴偏移，然后用step()完成一个动画
    animation.translateY(1000).step()
    // 用setData改变当前动画
    that.setData({
      // 通过export()方法导出数据
      animationData: animation.export(),
      // 改变view里面的Wx：if
      chooseSize: true
    })
    // 设置setTimeout来改变y轴偏移量，实现有感觉的滑动 滑动时间
    setTimeout(function() {
      animation.translateY(0).step()
      that.setData({
        animationData: animation.export(),
        clearcart: false
      })
    }, 100)
  },
  // 隐藏
  hideModal: function(e) {
    var that = this;
    var animation = wx.createAnimation({
      duration: 400,
      timingFunction: 'linear'
    })
    that.animation = animation
    animation.translateY(700).step()
    that.setData({
      animationData: animation.export()
    })
    setTimeout(function() {
      animation.translateY(0).step()
      that.setData({
        animationData: animation.export(),
        chooseSize: false
      })
    }, 500)
  }