vue v-for 循环里面不能调用外部data里面的字段

Question

TA卡，，循环输出的布局一样，只有几个文字根据点击的TAB卡不一样而不一样

我的判断依据是根据tab卡当前的ID值进行判断，如果放到循环体就取不到了。
放到外部，就要写两个循环了？
因为后端返回的字段都是一样的，只是点击购买中的循环中的文字和取值不一样

        <div class="demo-tab">
            <ul>
                <li @click="e=>this.current_tab=0" 
                    :class="{'active':this.current_tab===0}">
                    <b>购买中</b>
                    <em></em>
                </li>
                <li @click="e=>this.current_tab=1" 
                    :class="{'active':this.current_tab===1} ">
                    <b>待发货</b>
                    <em></em>
                </li>
                <li @click="e=>this.current_tab=2"
                    :class="{'active':this.current_tab===2}">
                    <b>已收货</b>
                    <em></em>
                </li>
            </ul>
        </div>
        
        <div class="demo-cont">
            <div class="" v-for="(item,index) in data" :key="index">
                这里只有购买中的字段不一样，其它两个都一样
            </div>
        </div>
        

Answer 1

请把问题描述的清楚一些

Answer 2

循环使用的数组用计算属性，在计算属性的方法中，先根据id把需要的值填充进数组中的每个对象即可

Answer 3

可以做成一个小组件，然后传递isSecond的prop，来判断是不是第二个循环
或者还可以用插槽来自定义名称

    <div class="demo-cont">
        <ul v-for="(item,index) in data" :key="index">
            <li :class="{'active':current_tab === index}"
            @click="current_tab = index" >
                <span v-if="index === 0">{{ isSecond ? '自定义字段' : item.name}}</span>
                <span v-else>{{ item.name }}</span>
            </li>
        </ul>
    </div>

不知道是不是我理解的这个意思