html - 反向迭代表（vue）

Question

我对这一切有点陌生，但我一直在尝试在 vue 中使用 slice().reverse()，但我一直在尝试的方式没有运气。我试图颠倒这张桌子的顺序。

                <div v-if="page == 'Calls'" >
                <h2 class="page-title">CALL MONITOR</h2>
                <h4 v-if="Object.keys(calls).length == 0" style="text-align: center; font-size: 20px; font-weight: bold; margin-top: 20px;">No incoming calls.</h4>
                <div style="margin: 0 auto; width: 100%; max-height: 90%; overflow-y: auto; margin-top: 20px;" v-if="Object.keys(calls).length > 0">
                    <table style="margin: 0 auto; width: 95%;">
                        <tr>
                            <th>#</th>
                            <th>Caller</th>
                            <th>Details</th>
                            <th>Date</th>
                            <th>Location</th>
                            <th>No. Attached</th>
                            <th>Actions</th>
                        </tr>
                        <tr v-for="(call, index) in calls" :key="index">
                            <td>{{index}}</td>
                            <td>{{call.source}}</td>
                            <td class="ellipsis"><span>{{call.details}}</span></td>
                            <td>{{call.time}}</td>
                            <td>{{call.location}}</td>
                            <td>{{attached(index)}}</td>
                            <td>
                                <i style="font-size: 1.5em;" class="fas fa-link" v-bind:class="getClass('clickable2')" v-if="current_call.id == null" v-on:click="AttachToCall(index)"></i>
                                <i style="font-size: 1.5em;" class="fas fa-unlink" v-bind:class="getClass('clickable2')" v-if="current_call.id == call.id" v-on:click="DetachFromCall(index)"></i>
                                <i style="font-size: 1.5em;" class="fas fa-map-marker-alt" v-bind:class="getClass('clickable2')" v-on:click="SetCallWaypoint(index)"></i>
                                <i style="font-size: 1.5em;" class="fas fa-info-circle" v-bind:class="getClass('clickable2')" v-on:click="ShowCallDetails(index)"></i>
                                <i style="font-size: 1.5em;" class="fas fa-edit" v-bind:class="getClass('clickable2')" v-if="current_call.id == call.id" v-on:click="EditCall(index)"></i>
                                <i style="font-size: 1.5em;" class="fas fa-trash" v-bind:class="getClass('clickable2')" v-on:click="DeleteCall(index)"></i>
                            </td>
                        </tr>
                    </table>
                </div>

标签： htmlvue.js