firebase - 如何在flutter中唯一标识widgets?

标签 firebase listview flutter dart widget

该功能是在从 ListView 中点击特定小部件时显示用户的个人资料屏幕。我想为每个小部件分配唯一 ID 的方法是从 Firebase 中检索所有 ID 作为数组,并通过循环迭代创建小部件。然后我将创建的小部件添加到列表并将该列表放入 ListView。 ListView 在应用程序中正确构建,但我不知道如何将唯一 ID 添加到 ListView 中的小部件,以便在点击它们时检索该小部件 ID 的配置文件并显示在新屏幕中。

我可能对解决这个问题有错误的想法。因为否则 ID 将在用户使用应用程序时呈现到应用程序中,这可能会导致漏洞问题。

我尝试使用小部件的 key 属性来存储用户唯一 ID。我还在网上搜索了是否有办法为小部件分配唯一 ID,但没有成功,或者我没有找到正确的方法。

enum ScreenStatus {
  NOT_DETERMINED,
  RETRIEVING_FRIEND_LIST,
  FRIEND_LIST_READY,
  FRIEND_PROFILE_OPEN
}

class FriendsScreen extends StatefulWidget {
  FriendsScreen({this.auth});

  final BaseAuth auth;

  @override
  State<StatefulWidget> createState() => _FriendsScreenState();
}

class _FriendsScreenState extends State<FriendsScreen> {
  ScreenStatus screenStatus = ScreenStatus.NOT_DETERMINED;

  List _friendList = [];

  @override
  void initState() {
    super.initState();
    widget.auth.retrieveUserDocument().then((document) {
      document.data.forEach((fieldName, fieldValue) {
        setState(() {
          if (fieldName == 'friends') {
            _friendList = fieldValue;
            print(_friendList);
          }
          screenStatus = _friendList == null
              ? ScreenStatus.RETRIEVING_FRIEND_LIST
              : ScreenStatus.FRIEND_LIST_READY;
        });
      });
    });
  }

  Widget _createFriendListWidget(List friendList) {
    List<Widget> list = List<Widget>();
    for (int i = 0; i < friendList.length; i++) {
      list.add(
        Card(
          child: InkWell(
            onTap: () {
              print('tapped');
            },
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                ListTile(
                  leading: Icon(Icons.album),
                  title: Text(friendList[i]),
                  subtitle: Text('Subtitle'),
                )
              ],
            ),
          ),
        ),
      );
    }
    return ListView(children: list);
  }

  Widget _buildFriendList() {
    return Scaffold(
      body: Container(
        child: _createFriendListWidget(_friendList),
      ),
    );
  }

  Widget _buildWaitingScreen() {
    return Scaffold(
      body: Container(
        alignment: Alignment.center,
        child: CircularProgressIndicator(),
      ),
    );
    ;
  }

  @override
  Widget build(BuildContext context) {
    switch (screenStatus) {
      case ScreenStatus.NOT_DETERMINED:
        return _buildWaitingScreen();
        break;
      case ScreenStatus.RETRIEVING_FRIEND_LIST:
        return _buildWaitingScreen();
        break;
      case ScreenStatus.FRIEND_LIST_READY:
        return _buildFriendList();
        break;
      default:
        return _buildWaitingScreen();
    }
  }
}

预期的结果是在使用用户的相应 ID 点击小部件时打开用户配置文件的新屏幕。

最佳答案

我认为您不需要识别小部件。相反,您可以在 onTap 闭包中使用用户 ID

这是更新后的 _createFriendListWidget 的样子:

  Widget _createFriendListWidget(List friendList) {
    List<Widget> list = List<Widget>();
    for (int i = 0; i < friendList.length; i++) {
      list.add(
        Card(
          child: ListTile(
            leading: Icon(Icons.album),
            title: Text(friendList[i]),
            subtitle: Text('Subtitle'),
            onTap: () {
              print("tapped ${friendList[i].id}"); // assume that id is in .id field
            }
          ),
        ),
      );
    }
    return ListView(children: list);
  }

另请注意,我已删除 Column,因为它只有一个子项,因此没有任何效果。我删除了 Inkwell,因为 ListView 也可以处理 onTap

关于firebase - 如何在flutter中唯一标识widgets?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57246096/

相关文章:

java - 如何限制ListView中的复选框被选中?

Flutter:如何等待android平台 channel 函数完成并返回结果

flutter - 如何在通知消息中显示多于一行(flutter_local_notifications程序包)

flutter - 按组显示发送方和接收方之间的消息列表,每个组标签对应于日期

reactjs - 使用 useEffect() Hook 和 Async/Await 从 Firebase/Firestore 获取数据

firebase - Firebase Spark(免费)计划是否适用于每个项目?

android - Xamarin:Firebase.Firestore.FieldValue 不包含 ArrayUnion 的定义

android - 如何使用带有 ListView 而不是 Recycler View 的折叠工具栏

java - 如何使用 onclick 函数从 MYSQL 加载的 ListView 传递值?

android - 即使应用程序未运行也能保持 FirebaseMessagingService 的服务并显示带有数据负载的通知