使用react-firebase-hooks如何按降序查询Firebase Cloud Firestore文档

完全不需要新增额外排序字段，也不用将timestamp存为负数，Firestore的orderBy方法原生支持指定排序方向，第二个参数传入'desc'即可实现降序排序。你提到的存储负数的方案仅适用于部分数值型字段的特殊排序场景，timestamp类型无需做这种额外处理。

代码修改 #

仅需调整查询语句的orderBy部分即可，修改后代码如下：

const messagesRef = firebase.firestore().collection(props.chatNum);
// 第二个参数指定desc即按timeSent降序排序，直接取最新的10条消息
const query = messagesRef.orderBy('timeSent', 'desc').limit(10);
const [messages] = useCollectionData(query, { idField : 'id' });

// 如果你的聊天UI是旧消息在上、新消息在下的常规布局，将拿到的降序数组反转后再渲染即可
const renderMessages = messages ? [...messages].reverse() : [];

return (
    <div className="messageBox">
        {renderMessages.map(message => (
            <Message key={message.id} text={message.text} spent={message.timeSent}/>
        ))}
    </div>
)

补充说明 #

• 在查询阶段直接指定desc排序，服务端返回的就是最新的10条消息，比前端拿到全量数据后再排序性能更高，也能避免升序查询取limit后再反转得到的是最早10条的问题
• 如果你的聊天UI是新消息在上的布局，直接渲染拿到的messages数组即可，无需反转操作

内容的提问来源于stack exchange，提问作者sharkeater123