按时间戳顺序过滤firebase数据答案

【问题标题】：Filter firebase data in order by timestamp按时间戳顺序过滤firebase数据
【发布时间】：2021-10-21 07:11:34
【问题描述】：

我正在尝试通过时间戳（createdAt）从 firebase 订购轨道 ID，但它似乎没有订购，但该功能仍然有效。不知道我哪里出错了？

任何帮助将不胜感激。

const [trackList, setTrackList] = useState();

//Option 1
    useEffect(() => {
        const userID = localStorage.getItem('id')
        firebase.database().ref(userID)
            .orderByChild('createdAt')
            .once('value', (snapshot) => {
                const firebaseTracks = snapshot.val();
                const trackList = [];
                for (let id in firebaseTracks) {
                    trackList.push({ id, ...firebaseTracks[id] });
                }
                setTrackList(trackList);
            });
    }, []);


//Option 2
useEffect(() => {
        const userID = localStorage.getItem('id')
        const trackRef = firebase.database().ref(userID).orderByChild("createdAt").limitToLast(100);
        trackRef.on('value', (snapshot) => {
            snapshot.forEach(symptomSnapshot => {
                const trackList = [];
                const firebaseTracks = symptomSnapshot.val();
                for (let id in firebaseTracks) {
                    trackList.push({ id, ...firebaseTracks[id] });
                }
                console.log(firebaseTracks)
            });
            setTrackList(trackList);
        });
    }, []);

【问题讨论】：

嘿弗兰克，你下面的代码运行良好，但我首先需要修复我的初始功能。 [link] (stackoverflow.com/questions/65747619/…) 这帮助我重写了添加到 firebase 的函数，它允许下面的代码工作。

标签： javascript reactjs firebase-realtime-database

【解决方案1】：

问题是当你在这里调用snapshot.val()时：

firebase.database().ref(userID)
    .orderByChild('createdAt')
    .once('value', (snapshot) => {
        const firebaseTracks = snapshot.val();

获取快照的值会返回一个 JSON 对象，而 JSON 对象中的键根据定义是无序的。

要按顺序处理结果，请使用snapshot.forEach，然后对每个孩子调用val()：

firebase.database().ref(userID)
    .orderByChild('createdAt')
    .once('value', (snapshot) => {
        const trackList = [];
        snapshot.forEach((child) => {
            trackList.push({ id: child.key, ...child.val() });
        }
        setTrackList(trackList);
    });

【讨论】：