如何遍历 Flutter AsyncSnapshot<DataSnapshot> for FirebaseAnimated List？

Question

我正在尝试遍历我的 Firebase 树以填充 FirebaseAnimatedList。我需要使用密钥以及所有提供的值。我假设由于迭代是异步内置到小部件中的，这就是它不像 JSON 迭代那样工作的原因。这是我的代码...

child: new FirebaseAnimatedList(
                      query: fb.child('NumberOnes').orderByChild('Value'),
                      padding: new EdgeInsets.all(8.0),
                      reverse: false,
                      itemBuilder: (_, DataSnapshot followerSnap,
                          Animation<double> animation, int Index) {
                        return new FutureBuilder<DataSnapshot>(
                            future: fb
                                .child('NumberOnes')
                                .orderByChild('Value')
                                .once(),
                            builder: (BuildContext context,
                                AsyncSnapshot<DataSnapshot> userSnap) {
                              switch (userSnap.connectionState) {
                                case ConnectionState.none:
                                  return new Text('Loading...');
                                case ConnectionState.waiting:
                                  return new Text('Awaiting result...');
                                default:
                                  if (userSnap.hasError)
                                    return new Text('Error: ${userSnap.error}');
                                  else
                                    print(userSnap.data.value.toString());
                                    return new Container(
                                      child: new Text(
                                          userSnap.data.value.toString()),
                                    );
                              }
                            });
                      })

这是print(userSnap.data.value.toString());的日志...

{aZb6KxxIuWA: {Value: 1, vidImage: https://i.ytimg.com/vi/aZb6KxxIuWA/mqdefault.jpg, vidId: aZb6KxxIuWA, vidTitle: 10 Embarrassing K-POP Star Fails And Accidents}, 4408NthSJis: {Value: 1, vidImage: https://i.ytimg.com/vi/4408NthSJis/mqdefault.jpg, vidId: 4408NthSJis, vidTitle: [TOP 100] MOST VIEWED K-POP MUSIC VIDEOS • APRIL 2017}, 7n5ieHnu90w: {Value: 1, vidImage: https://i.ytimg.com/vi/7n5ieHnu90w/mqdefault.jpg, vidId: 7n5ieHnu90w, vidTitle: BTS - I NEED U {Color coded lyrics Han|Rom|Eng}}, 8kyG5tTZ1iE: {Value: 1, vidImage: https://i.ytimg.com/vi/8kyG5tTZ1iE/mqdefault.jpg, vidId: 8kyG5tTZ1iE, vidTitle: SHINee 샤이니_Sherlock•셜록 (Clue + Note)_Music Video}, iy94tB5MldE: {Value: 1, vidImage: https://i.ytimg.com/vi/iy94tB5MldE/mqdefault.jpg, vidId: iy94tB5MldE, vidTitle: Simon D (사이먼디) - 짠해 (Cheerz) [MV ENG SUB]}, XuSYtAsMxfY: {Value: 1, vidImage: https://i.ytimg.com/vi/XuSYtAsMxfY/mqdefault.jpg, vidId: XuSYtAsMxfY, vidTitle: YOUTUBERS REACT TO K-Pop #3}, IZ1t7CwfvEc: {Value: 1, vidImage: https://i.ytimg.com/vi/IZ1t7CwfvEc/mqdefault.jpg, vidId: IZ1t7CwfvEc, vidTitle: GOT7 "Never Ever" M/V}, 2ips2mM7Zqw: {Value: 2, vidImage: https://i.ytimg.com/vi/2ips2mM7Zqw/default.jpg, vidId: 2ips2mM7Zqw, vidTitle: BIGBANG - 뱅뱅뱅 (BANG BANG BANG) M/V}, IlJHZJ8EqeA: {Value: 2, vidImage: https://i.ytimg.com/vi/IlJHZJ8EqeA/mqdefault.jpg, vidId: IlJHZJ8EqeA, vidTitle: MINO - '몸(BODY)' M/V}, 0Pinupmqwaw: {Value: 5, vidImage: https://i.ytimg.com/vi/0Pinupmqwaw/default.jpg, vidId: 0Pinupmqwaw, vidTitle: 직 재스퍼 (Zick Jasper) - PRIMETIME (Feat. 지구인)}}

最终计划是将此信息填充到容器内的Cards 中，而不是文本中。

我没有收到错误，但这里是“容器”和文本的屏幕截图..

Answer 1

我不确定我是否理解您的问题，我认为您在这里不需要FutureBuilder。 FirebaseAnimatedList 已经为您提供了 itemBuilder 的 followerSnap 参数中的数据。

附：一般来说，您应该更喜欢 StreamBuilder 和 onValue 而不是 FutureBuilder 和 once()，这样您的数据就不会过时。

Answer 2

我认为您在这里更多地询问如何迭代与问题标题无关的 JSON 对象，如果这是您所要求的，您仍然应该遵循 Collin 的建议。

你说数据值是这样的

{aZb6KxxIuWA: {Value: 1, vidImage: https://i.ytimg.com/vi/aZb6KxxIuWA/mqdefault.jpg, vidId: aZb6KxxIuWA, vidTitle: 10 Embarrassing K-POP Star Fails And Accidents}, 4408NthSJis: {Value: 1, vidImage: https://i.ytimg.com/vi/4408NthSJis/mqdefault.jpg, vidId: 4408NthSJis, vidTitle: [TOP 100] MOST VIEWED K-POP MUSIC VIDEOS • APRIL 2017}, 7n5ieHnu90w: {Value: 1, vidImage: https://i.ytimg.com/vi/7n5ieHnu90w/mqdefault.jpg, vidId: 7n5ieHnu90w, vidTitle: BTS - I NEED U {Color coded lyrics Han|Rom|Eng}}, 8kyG5tTZ1iE: {Value: 1, vidImage: https://i.ytimg.com/vi/8kyG5tTZ1iE/mqdefault.jpg, vidId: 8kyG5tTZ1iE, vidTitle: SHINee 샤이니_Sherlock•셜록 (Clue + Note)_Music Video}, iy94tB5MldE: {Value: 1, vidImage: https://i.ytimg.com/vi/iy94tB5MldE/mqdefault.jpg, vidId: iy94tB5MldE, vidTitle: Simon D (사이먼디) - 짠해 (Cheerz) [MV ENG SUB]}, XuSYtAsMxfY: {Value: 1, vidImage: https://i.ytimg.com/vi/XuSYtAsMxfY/mqdefault.jpg, vidId: XuSYtAsMxfY, vidTitle: YOUTUBERS REACT TO K-Pop #3}, IZ1t7CwfvEc: {Value: 1, vidImage: https://i.ytimg.com/vi/IZ1t7CwfvEc/mqdefault.jpg, vidId: IZ1t7CwfvEc, vidTitle: GOT7 "Never Ever" M/V}, 2ips2mM7Zqw: {Value: 2, vidImage: https://i.ytimg.com/vi/2ips2mM7Zqw/default.jpg, vidId: 2ips2mM7Zqw, vidTitle: BIGBANG - 뱅뱅뱅 (BANG BANG BANG) M/V}, IlJHZJ8EqeA: {Value: 2, vidImage: https://i.ytimg.com/vi/IlJHZJ8EqeA/mqdefault.jpg, vidId: IlJHZJ8EqeA, vidTitle: MINO - '몸(BODY)' M/V}, 0Pinupmqwaw: {Value: 5, vidImage: https://i.ytimg.com/vi/0Pinupmqwaw/default.jpg, vidId: 0Pinupmqwaw, vidTitle: 직 재스퍼 (Zick Jasper) - PRIMETIME (Feat. 지구인)}}

只是为了向您展示这是如何工作的，将您的Text替换为FlatButton，并在onPressed回调中调用_handleJson方法，_handleJson将userSnap.data.value作为参数，如下所示：

   default:
if (userSnap.hasError)
    return new Text('Error: ${userSnap.error}');
else
    print(userSnap.data.value.toString());
    return new Container(
       new FlatButton(onPressed: _handleJson(userSnap.data.value),
          child: new Text("Load Data"),);

你的方法看起来像这样

_handleJson(value) {
    List myList = new List();
    for (var value in value.values) {
      myList.add(value);
    }
    print(myList);
  }

如果您主要对 JSON 进行编码，这应该可以工作，如果这对您有用，请告诉我。