绿满眶商城微信小程序-uniapp
zxl
4 天以前 4c0c7752dc996baba58f33aa101a7385752061a3
components/TopBar.vue
@@ -1,5 +1,5 @@
<template>
   <view class="top-bar" :style="{paddingTop: statusBarHeight + 'px'}">
   <view class="top-bar" :style="{paddingTop: statusBarHeight + 'px', backgroundColor: bgColor}" :class="{'has-bg': bgColor !== 'transparent'}">
      <view class="top-bar-content">
         <!-- 标题列表 -->
         <scroll-view class="title-scroll" scroll-x="true" scroll-with-animation :scroll-left="scrollLeft">
@@ -31,6 +31,10 @@
         textColor: {
            type: String,
            default: 'white'
         },
         bgColor: {
            type: String,
            default: 'transparent'
         }
      },
      data() {
@@ -44,6 +48,11 @@
                  title: '推荐'
               },
               {
                  index: 'kitchenCustomize',
                  pagePath: '/pages/kitchen/KitchenCustomize',
                  title: '厨房定制'
               },
               {
                  index: 'shop',
                  pagePath: '/pages/commodity-square/commoditySquare',
                  title: '商品广场'
@@ -53,11 +62,11 @@
                  pagePath: '/pages/mine/activity/reportActivity',
                  title: '活动'
               },
               {
                  index: 'health',
                  pagePath: '/pages/health/healthVideo',
                  title: '大健康'
               }
               // {
               //    index: 'health',
               //    pagePath: '/pages/health/healthVideo',
               //    title: '大健康'
               // }
            ]
         };
      },
@@ -98,6 +107,10 @@
         left: 0;
         right: 0;
         z-index: 999;
      }
      .top-bar.has-bg {
         box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
      }
      
      .top-bar .top-bar-content {
@@ -144,4 +157,4 @@
         /* background-color: white; */
         border-radius: 4rpx;
      }
</style>
</style>