[Vuejs]-Styling specific table cell using Vue.js and v-repeat

by

0👍

I would first preprocess your data by running through each of the rpts and adding a flag to the row if it is the last of that report (example code using lodash):

_.forEach(objArr, function (obj, index) {
    var previousRpt = null;
    _.forEach(obj.rpts, function (rpt, index) {
        if (previousRpt == null || previousRpt.rptId == rpt.rptId) {
            previousRpt.last = false;
        }
        rpt.last = true;
        previousRpt = rpt;
    });
});

And use that new value like this:

<table id="rpts">
    <tr v-repeat="reports">
        <td v-repeat="rpts | orderBy 'rptID'"
            v-class="lastOfRptID: last">{{score}}</td>
    </tr>
</table>

Leave a comment