I have a table body in my Vue application in which I build a portion of the rows by looping through a data object. I then have a separate section that uses a different data object, however, I need to compare its value to the value in another loop for conditional styling.
I would like to know if there is a way to send the value
part of the data into a method call during the first for loop so that I can access it in the summary loop, if so the words said.
This is the form:
<tbody v-if="selected === 'Stores'"> <tr v-for="(value, manager) in managerNumbers" :key="manager"> <!--这是我想知道是否可以将value发送到方法调用的地方--> <td v-for="date in dates" :key="date" > <div v-for="(dataForDate, dateVal) in value.dates" :key="dateVal"> <div v-if="dateVal == date "> @{{dataForDate.total_categories}} </div> </div> </td> </tr> <tr><td colspan="10"></td></tr> <tr><td colspan="10"></td></tr> <tr> <th> 汇总 </th> <div v-for="store in activeStore" :key="store"> <th :style="'background: ' + (value.qty > store.qty ? '#000' : '#fff')">@{{ store.stock_num }}</th> </div> </tr> </tbody>
You can use the calculation method to create a lookup table between
activeStore
andmanagerNumbers
and loop through it.Now you can use this array to loop through your
v-for
:v-for="(obj, index) in activeStoreAndManagerNumbers"
Now, both
obj.value.qty
andobj.store.qty
can be used in the same loop.