使用VueFire，我如何按日期按降序排列（從最新到最舊）？

我目前正在使用VueJS，Firebase和VueFire創建一個項目。我遇到的問題是訂購最新到最舊的帖子列表。使用VueFire，我如何按日期按降序排列（從最新到最舊）？

我試過使用Firebase的內置查詢，如list.orderByChild('date')，但沒有運氣。

我知道我需要使用Array.sort((a,b) => { return new Date(a.date) - new Date(b.date) })，但我正在艱難的工作時間讓我與VueFire一起工作，甚至創建一個Vue過濾器。

讓我知道如果我可以提供其他任何東西。

這是我的數據庫是什麼樣子：

這裏是我的代碼：

來源

2017-04-24 Corbin Jensen

假設你獲取的職位，並將它們存儲在一個數組[]然後使用v-for並遍歷數組並顯示帖子。

您可以使用此解決方法：

的，當你取從火力帖子默認情況下，你的職位從最舊到最新
所以你可以用Array.unshift()方法將帖子添加到您的帖子數組顛倒了添加到您的數組的項目順序
由於項目在數組中以相反的順序添加，因此您現在可以定期循環使用v-for個並顯示oosts

來源

2017-04-24 06:18:24

最容易的選擇（除了使用orderByChild('date')）可能會是一個computed property，在這裏你將有這樣的事情：

import firebase from './firebase' 

var vm = new Vue({ 
    el: '#example', 
    firebase // bring in your firebase module here 
    data: { 
    message: 'Hello' 
    }, 
    computed: { 
    // a computed getter 
    sortedList: function() { 
     // `this` points to the vm instance 
     return this.items.sort((a,b) => { return new Date(a.date) - new Date(b.date) }) 
    } 
    } 
})

這個屬性會自動更新時，任何的它取決於變化的屬性，從而保持它實時&反應:)

來源

2017-04-24 09:19:30

謝謝你們的迴應！

我最終做的是向保存到數據庫的列表項添加另一個值。

我添加的子order所以當我保存火力它的對象看起來是這樣的：

var newItem = { 
    title: "Title to the post", 
    order: (this.itemListFromDatabase.length + 1) * -1 
} 
firebase.database().ref('itemList').push(newItem);

我給它一個負值，因爲當你調用orderByChild()它將按升序訂購。似乎現在工作得很好。

當我取回我的名單看起來是這樣的：

firebase: { 
    list: firebase.database().ref('list').orderByChild('order') 
}

來源

2017-04-24 14:04:55

使用VueFire，我如何按日期按降序排列（從最新到最舊）？

回答

相關問題