老师，我觉得没有必要在子组件中再定义activeIndex；直接使用defaultIndex，点击时emit触发父组件改变defaultIndex就可以；

子组件：

<template>

<view class="tab-container">

<scroll-view scroll-x class="scroll-view" scroll-with-animation>

      <view class="tab-item-box">

        <block v-for="(item,index) in tabData" :key="index">

          <view class="tab-item" :class="{'active': index === defaultIndex}" @click="onTabClick(index)">{{ item.label }}</view>

        </block>

      </view>

    </scroll-view>

</view>

</template>

<script>

export default {

name:"my-tabs",

props: {

config: {

        type: Object,

        default: () => {

          return {}

        }

      },

      tabData: {

        type: Array,

        default: () => {

          return []

        }

      },

      defaultIndex: {

        type: Number,

        default: 0

      }

},

data() {

return {

// activeIndex: -1

};

},

    // watch: {

    //   defaultIndex: {

    //     handler (val) {

    //       this.activeIndex = val

    //     },

    //     immediate: true

    //   }

    // },

    methods: {

      onTabClick (index) {

        // this.activeIndex = index

        this.$emit('tabClick', index)

      }

    }

}

</script>

<style scoped>

.tab-container {

  font-size: $uni-font-size-base;

  width: 100%;

  height: 45px;

  line-height: 45px;

  background-color: $uni-bg-color;

  .scroll-view {

    white-space: nowrap;

    width: 100%;

    height: 100%;

    box-sizing: border-box;

    .tab-item-box {

      height: 100%;

      .tab-item {

        height: 100%;

        display: inline-block;

        text-align: center;

        padding: 0 15px;

        position: relative;

        color: $uni-text-color;

        &.active {

          color: $uni-text-color-hot;

        }

      }

    }

  }

}

</style>

父组件：

<template>

<view class="hot-container">

<image

      class="logo"

src="@/static/images/logo.png"

mode="aspectFit"

/>

    <view class="search-box">

      <my-search placeholderText="uni-app 自定义组件"></my-search>

    </view>

    <my-tabs :tabData="tabData" :config="config" :defaultIndex="defaultIndex" @tabClick="tabClickHandle"></my-tabs>

</view>

</template>

<script>

import { getHotTabs } from '../../api/hot'

export default {

data() {

return {

tabData: [],

        config: {},

        defaultIndex: 0

};

},

    created () {

      this.loadHotTabs()

    },

    methods: {

      async loadHotTabs () {

        const res = await getHotTabs()

        this.tabData = res.data.list

      },

      tabClickHandle (index) {

        console.log(index, '父组件')

        this.defaultIndex = index

      }

    }

}

</script>

<style scoped>

.hot-container {

  background-color: $uni-bg-color;

  .logo {

    width: 750rpx;

    height: 80px;

  }

  .search-box {

    padding: 0 16px;

    margin-bottom: $uni-spacing-base;

  }

}

</style>