根据需求,需要同一期的账单合并显示

先把请求过来的数据处理一下,将同一期的账单合并到一个数组。
根据数组里某属性是否相同来判断,因为我这个相同的属性的值是有序数字就比较好处理。

const arr = [];
    for (let item of list) {
        if (arr[item.term - 1]) {
            arr[item.term - 1].push(item);
        } else {
            arr[item.term - 1] = [];
            arr[item.term - 1].push(item);
        }
    }
复制代码

不是数字的话,可以将arr换成object,最后用Object.keys()Object.entries()将获得对象插入到数组中; table里利用了v-for嵌套 和 :rowspanv-if来渲染

<tbody class="order-body" v-for="item in orderList">
    <tr v-for="(i,index) in item">
        <td :rowspan="item.length" v-if="index==0">{{i.term}}</td>
        <td>{{i.type}}</td>
        <td>{{i.beginAt}}-{{i.endAt}}</td>
        <td>{{i.needPay}}</td>
        <td>{{i.beginAt}}</td>
        <td>{{i.payAt}}</td>
        <td>{{i.orderStatus}}</td>
        <td>11</td>
    </tr>
</tbody>
复制代码

转载于:https://juejin.im/post/5c3ed4cef265da61427422b2

Logo

前往低代码交流专区

更多推荐