以降序发布的顺序显示帖子

use*_*591 38 javascript firebase

我正在尝试测试Firebase以允许用户使用发布评论push.我想用以下内容显示我检索的数据;

fbl.child('sell').limit(20).on("value", function(fbdata) { 
  // handle data display here
}
Run Code Online (Sandbox Code Playgroud)

问题是数据按最旧到最新的顺序返回 - 我希望它按相反的顺序排列.Firebase可以这样做吗?

Fra*_*len 43

由于撰写了这个答案,Firebase添加了一项功能,允许任何孩子或按价值排序.因此,现在有四种订购数据的方式:按键,按值,按优先级或按任何指定子项的值.请参阅此博客文章,其中介绍了新的订购功能.

但基本方法仍然相同:

1.添加具有反转时间戳的子属性,然后对其进行排序.

2.按升序读取子项,然后在客户端上反转它们.

Firebase支持以两种方式检索集合的子节点:

  • 按名字
  • 优先考虑

你现在得到的是名字,这恰好是按时间顺序排列的.这不是巧合btw:当你将push一个项目放入一个集合时,会生成该名称以确保以这种方式对孩子进行排序.引用Firebase文档push:

push()生成的唯一名称以客户端生成的时间戳为前缀,以便生成的列表按时间顺序排序.

关于有序数据Firebase指南就此话题说:

如何订购数据

默认情况下,Firebase节点上的子项按名称按字典顺序排序.使用push()可以生成按时间顺序自然排序的子名称,但许多应用程序要求以其他方式对其数据进行排序.Firebase允许开发人员通过为每个项目指定自定义优先级来指定列表中项目的顺序.

获取所需行为的最简单方法是在添加项目时指定始终递减的优先级:

var ref = new Firebase('https://your.firebaseio.com/sell');
var item = ref.push();
item.setWithPriority(yourObject, 0 - Date.now());
Run Code Online (Sandbox Code Playgroud)

更新

您还必须以不同方式检索孩子:

fbl.child('sell').startAt().limitToLast(20).on('child_added', function(fbdata) {
  console.log(fbdata.exportVal());
})
Run Code Online (Sandbox Code Playgroud)

在我的测试中使用on('child_added'确保添加的最后几个子项以反向时间顺序返回.on('value'另一方面,使用它们按名称的顺序返回它们.

请务必阅读"阅读有序数据"部分,该部分解释了child_*用于检索(订购)子项的事件的用法.

用于演示此功能的垃圾箱:http://jsbin.com/nonawe/3/watch?js,console


Mak*_*jer 11

从firebase 2.0.x开始,您可以使用它limitLast()来实现:

fbl.child('sell').orderByValue().limitLast(20).on("value", function(fbdataSnapshot) { 
  // fbdataSnapshot is returned in the ascending order
  // you will still need to order these 20 items in
  // in a descending order
}
Run Code Online (Sandbox Code Playgroud)

以下是该公告的链接:Firebase中的更多查询功能

  • 您可以使用`prepend`以相反的顺序添加项目,而不是`append`. (8认同)

Kat*_*ato 7

为了增加弗兰克的答案,也可以抓住最新的记录 - 即使你没有打算用优先顺序排序 - 只需使用endAt().limit(x)这样的方法demo:

var fb = new Firebase(URL);

// listen for all changes and update
fb.endAt().limit(100).on('value', update);

// print the output of our array
function update(snap) {
   var list = [];
    snap.forEach(function(ss) {
       var data = ss.val();
       data['.priority'] = ss.getPriority();
       data['.name'] = ss.name();
       list.unshift(data); 
    });
   // print/process the results...
}
Run Code Online (Sandbox Code Playgroud)

请注意,即使可能有一千条记录(假设有效载荷很小),这也非常有效.对于更强大的用法,Frank的答案是权威的,更具可扩展性.

通过执行诸如监视child_added/ child_removed/ child_moved事件代替之类的操作value以及使用去抖动来批量应用DOM更新而不是单独应用DOM更新,还可以优化此强力来处理更大的数据或更多记录.

自然,无论采用何种方法,DOM更新都是一个很难的东西,一旦你进入数百个元素,所以debounce方法(或React.js解决方案,本质上是一个优步的去抖)是一个很好的工具.


Goo*_*ife 5

真的没有办法,但似乎我们有 recyclerview 我们可以拥有这个

 query=mCommentsReference.orderByChild("date_added");
        query.keepSynced(true);

        // Initialize Views
        mRecyclerView = (RecyclerView) view.findViewById(R.id.recyclerView);
        mManager = new LinearLayoutManager(getContext());
//        mManager.setReverseLayout(false);
        mManager.setReverseLayout(true);
        mManager.setStackFromEnd(true);

        mRecyclerView.setHasFixedSize(true);
        mRecyclerView.setLayoutManager(mManager);
Run Code Online (Sandbox Code Playgroud)