Fields in the external data cannot be called in the vue v-for loop

TA card, the layout of circular output is the same, only a few words vary according to the TAB card clicked

my judgment is based on the current ID value of the tab card, which cannot be obtained if it is put into the loop body. When
is put on the outside, two loops are about to be written?
because the fields returned by the backend are all the same, but the text and values in the loop in the click purchase are different

        <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>
        
Apr.11,2021

Please give some clear descriptions of the problem


using the calculation attributes. In the method of calculating the properties, you can first fill in the required values into each object in the array according to id


.

can be made into a widget, and then pass the prop, of isSecond to determine whether it is a second loop
or you can also use a slot to define the name

.
    <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>

I don't know if I understand this meaning

Menu