我如何使用StreamBuilder检索特定的用户数据？

Question

1）这是视图团队/视图名册屏幕。 https://imgur.com/a/k63lQrt

  class ViewTeamScreen extends StatelessWidget {
  static const routeName = '/view-team';
  const ViewTeamScreen({Key key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return StreamProvider<List<User>>.value(
      value: DBService().getAllUsers,
      child: Scaffold(
        body: TeamList()
      ),
    );
  }
}

2）这是团队列表代码，用于在ViewTeamScreen上显示所有用户数据并返回我创建的TeamTile小部件。

class TeamList extends StatefulWidget {
  @override
  _TeamListState createState() => _TeamListState();
}

class _TeamListState extends State<TeamList> {
  @override
  Widget build(BuildContext context) {
    final users = Provider.of<List<User>>(context) ?? [];
    //print(users);

    return ListView.builder(
      itemCount: users.length,
      itemBuilder: (context, index) {
        return TeamTile(
          user: users[index],
        );
      },
    );

3）这是TeamTile，一旦他们注册了应用程序，它就会为团队成员返回ListViewBuilder。

class TeamTile extends StatelessWidget {
  final User user;
  TeamTile({this.user});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.only(top: 8.0),
      child: Card(
        margin: EdgeInsets.fromLTRB(20, 6, 20, 0),
        child: ListTile(
          leading: CircleAvatar(
            radius: 30.0,
            backgroundColor: Colors.brown,
          ),
          title: Text(
            '${user.firstName}'
            " "
            '${user.lastName}', //how do i make the first letter of name always CAPS?
            style: TextStyle(fontSize: 23, letterSpacing: 1.0),
          ),
          trailing: Text(user.email),
          subtitle: Text('+44 0000 000 000'),
          onTap: () async {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => TeamDetailScreen(),
              ),
            );
          },
        ),

4）这是团队详细信息屏幕，一旦用户在ViewTeamScreen中点击ListTile，该页面就会出现。 https://imgur.com/a/7tSUO1c

class TeamDetailScreen extends StatelessWidget {
  @override
Widget build(BuildContext context) {
    final user = Provider.of<User>(context);
    return Scaffold(
      appBar: AppBar(
        title: Text('Employee Contact Info'),
      ),
      body: StreamBuilder<User>(
        stream: DBService(uid: user.uid).usersData,
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            User userData = snapshot.data;

            return Column(children: <Widget>[
              Expanded(
                  child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  'Name: ${userData.firstName}'
                  " "
                  '${userData.lastName}\n'
                  'Email: ${userData.email}',
                  style: TextStyle(fontSize: (20)),
                ),
              )),
            ]);
          } else {
            return Loading();

Answer 1

这将排除 StreamProvider ，而仅使用 StreamBuilder 。这个概念很容易理解，因为我们要做的只是将 widget.index 传递给其他Widget作为参数。

1

class ViewTeamScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StreamBuilder<List<User>>(
        stream: DBService().getAllUsers,
        builder: (context, snapshot) {

          if (snapshot.hasData) {
            List<User> userData = snapshot.data;

            return Scaffold(body: TeamList(myData: userData));
          } else {
            return Loading();
          }
        });
  }
}

2

 class TeamList extends StatefulWidget {
      final List<User> myData;

      TeamList({this.myData});

      @override
      _TeamListState createState() => _TeamListState();
    }

    class _TeamListState extends State<TeamList> {
      @override
      Widget build(BuildContext context) {
        return ListView.builder(
          itemCount: widget.myData.length,
          itemBuilder: (context, index) {
            return TeamTile(
              usersInfo: widget.myData[index],
            );
          },
        );
      }
    }

3

class TeamTile extends StatelessWidget {
  final User usersInfo;
  TeamTile({this.usersInfo});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.only(top: 8.0),
      child: Card(
        margin: EdgeInsets.fromLTRB(20, 6, 20, 0),
        child: ListTile(
          leading: CircleAvatar(
            radius: 30.0,
            backgroundColor: Colors.brown,
          ),
          title: Text(
            '${usersInfo.firstName}'
            " "
            '${usersInfo.lastName}', //how do i make the first letter of name always CAPS?
            style: TextStyle(fontSize: 23, letterSpacing: 1.0),
          ),
          trailing: Text(usersInfo.email),
          subtitle: Text('+44 0000 000 000'),
          onTap: () async {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => TeamDetailScreen(myDetails: usersInfo),
              ),
            );
          },
        ),
      ),
    );
  }
}

4

 class TeamDetailScreen extends StatelessWidget {
      final User myDetails;
      TeamDetailScreen({this.myDetails});

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(),
          body: Column(children: <Widget>[
            Expanded(
                child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text(
                'Name: ${myDetails.firstName}'
                " "
                '${myDetails.lastName}\n'
                'Email: ${myDetails.email}',
                style: TextStyle(fontSize: (20)),
              ),
            )),
          ]),
        );
      }
    }