先上效果图

思路剖析

1.给第一层级添加字段showFlag，默认值都为0
2.在切换方法中传入第一和第二层级的index,将对应外层级的showFlag的值等于内层级的index
3.在视图中的内层循环动态设置class,该class的满足条件：内层index === 外层数组list[parentIndex].showFlag

上代码

 <div class="system-item" v-for="(data,parentIndex) in dataDiskList">
        <div class="system-text">数据盘</div>
             <div class="item-box" @click="switchDataSize(index,parentIndex)" :class="{ 'item-box-active':index === dataDiskList[parentIndex].showFlag }"  v-for="(item,index) in diskListData" :key="index">
                            {{item.size}}GB
        </div>
</div>

switchDataSize(index,parentIndex){
    this.dataDiskList[parentIndex].showFlag = index
}  

最后只需要设置item-box-active的样式就好了