I'm using Vue in a web page and I'd like to have a table data value be a rolling total of values that have been printed into a certain div in my table
I'm hoping to avoid computation or any manipulation of the data itself, but I'd like to take any values that have been printed in the div with id totals and just total them up for a grand total where my comment is
Can I roll up values based on div id in vue like this?
My code:
<tr v-for="(value, warehouse) in numbersByWarehouse" :key="warehouse">
<td>@{{warehouse}}</td>
<td v-for="date in dates" :key="date" >
<div v-for="(dataByDate, dateValue) in value.dates" :key="dateValue">
<div id="totals" v-if="dateValue == date ">
@{{dataByDate.total_categories}}
</div>
</div>
</td>
<td>
<!-- I want this to be a total of all values for @{{dataByDate.total_categories }} in div ID totals -->
</td>
</tr>
//here's the returned object for reference
numbersByWarehouse() {
warehouseRows = [
{
"13401 - TEST ":{
"dates":{
"2021-11-11":{
"categories":420,
"qty":1,
"total_categories":420,
}
},
},
]
console.log(warehouseRows)
return warehouseRows
},