在firebase中显示数据以进行颤振

2 回答

• 0

  你非常接近 .

  您声明Map Map<dynamic, dynamic> data = event.data.snapshot.value; 但不使用它，而只是在 Text 小部件中使用 event.data.snapshot.value . event.data.snapshot.value 是Firebase中子项下的所有数据 . 这就是您在名称和描述中看到所有数据的原因 . 取而代之的是你应该使用 data['name'] 和描述 data['description'] . 方括号中的字符串是firebase数据库中的键 .

  另一个建议是在 one StreamBuilder 中显示所有用户数据，因为您不会两次下载数据 . 在这样一个简单的例子中它并不重要，但是当你开始处理更大的数据时，这可能会影响加载时间 .

  这是 _ProfileCardState 的修订版本（希望）对您有用 . 如果您还有其他问题，请与我们联系 .

  class _ProfileCardState extends State<ProfileCard> {
    Widget _buildProfileSynopsis() {
      return new Positioned(
        left: 0.0,
        right: 0.0,
        bottom: 0.0,
        child: new Container(
          padding: const EdgeInsets.all(24.0),
          child: new Row(
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
              new Expanded(
                child: new Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    new StreamBuilder<Event>(
                      stream: FirebaseDatabase.instance
                          .reference()
                          .child('items')
                          .child('-LD2vzOCd54yEFNXJpGj')
                          .onValue,
                      builder:
                          (BuildContext context, AsyncSnapshot<Event> event) {
                        if (!event.hasData)
                          return new Center(child: new Text('Loading...'));
                        Map<dynamic, dynamic> data = event.data.snapshot.value;
                        return Column(children: [
                          new Text('${data['name']}',
                              style: new TextStyle(fontSize: 30.0)),
                          new Text('-${data['description']}')
  
                        ]);
                      },
                    ),
                  ],
                ),
              ),
              new Icon(
                Icons.info,
                color: Colors.black,
              ),
            ],
          ),
        ),
      );
    }
  

  这是一张图片：

  

  回复于 2024-05-17T19:09:55+08:00
• 1

  早上好

  我的方法与你悄然不同 . 我总是写一个类来从数据源获取数据然后我在每个地方使用它 . 我认为你是这个框架的新手，所以我将按步骤解释

  获取数据类是：

  class GetItemsFromDb {
    static Future<List> getItems( ) async {
      Completer<List> completer = new Completer<List>();
  
      FirebaseDatabase.instance
          .reference()
          .child("males")
          .once()
          .then( (DataSnapshot snapshot) {
        //print(snapshot.value);
        List map = snapshot.value;
        completer.complete(map);
      } );
  
      return completer.future;
    }
  }
  

  正如你所说，你想要男性的所有物品 . Firebase数据库会为您提供一个 Map 列表（Map是一个字典） .

  我会再次重写你的Males对象

  class Males {
    String names;
    String desc;
  
  
    // empty constructor 
    Males();
  
    // constructor for firebase databases 
    Males.fromMap(Map<String, dynamic> map){
      names = map["name"];
      desc  = map["description"];
    }
  
  }
  

  现在你把它放在你的视野中

  List<Males> _males = [];
    @override
    void initState() {
      // TODO: implement initState
      super.initState();
  
      GetItemsFromDb.getItems().then((list){
        print("Now the list is here");
  
        setState(() {
          for (int i=0; i < list.length; i++) {
            Map<String, dynamic> map = list[i];
  
            Males male = new Males.fromMap(map);
            _males.add(male);
          }
        });
  
      });
    }
  

  now you have the full list from firebase and their data, and you can display them all

  回复于 2024-05-17T19:09:55+08:00