uni-app仿今日头条滚动tab导航

uni-app仿今日头条滚动tab导航，如下图：

 

dom结构：

    <!-- 顶部选项卡 -->
    <scroll-view scroll-x class="scroll-row" :scroll-into-view="scrollInto" scroll-with-animation>
      <view 
        v-for="(item,index) in tabBars" 
        :key="index" 
        :id="'tab'+index" 
        style="height: 100rpx;" 
        class="scroll-row-item px-3 py-2 font-md"
        :class="tabIndex===index?'text-main font-lg font-weight-bold':''" 
        @click="changeTab(index)">
          {
  {item.name}}
      </view>
    </scroll-view>