首页 > 解决方案 > 如何在下拉列表中获取所选选项的状态并在 Firebase 中显示

问题描述

我有一个用户输入和两个选择选项下拉菜单。我displayName从状态中检索(用户输入值)并将其显示在 Firestore 数据库中,但是,我无法从状态中获取选定的选项(selectedItemAselectedItemB)并将它们显示在数据库中。

我怎样才能让这些值(selectedItemAselectedItemB)显示在数据库中?

状态

class UserInfoState with ChangeNotifier {
  String _displayName;
  dynamic _selectedItemA;
  dynamic _selectedItemB;

  get displayName => _displayName;
  get selectedItemA => _selectedItemA;
  get selectedItemB => _selectedItemB;

  set displayName(String value) {
    _displayName = value;
    notifyListeners();
  }

  set selectedItemA(dynamic value) {
    _selectedItemA = value;
    notifyListeners();
  }

  set selectedItemB(dynamic value) {
    _selectedItemB = value;
    notifyListeners();
  }
}

Future<void> updateUserReportWithUserInfo(UserInfoState state) {
  return Global.reportRef.upsert(
    ({
      'displayName': state.displayName,
      'selectedItemA': state.selectedItemA,
      'selectedItemB': state.selectedItemB
    }),
  );
}

个人资料屏幕

@override
  void initState() {
    super.initState();

    myFocusNode = FocusNode();

    _dropdownMenuItemsA = buildDropDownMenuItemsA(_dropdownItemsA);
    selectedItemA = _dropdownMenuItemsA[0].value;

    _dropdownMenuItemsB = buildDropDownMenuItemsB(_dropdownItemsB);
    selectedItemB = _dropdownMenuItemsB[0].value;
  }
...
List<DropdownMenuItem<ContinentListItem>> _dropdownMenuItemsA;
  ContinentListItem selectedItemA;

  List<DropdownMenuItem<ContinentListItem>> buildDropDownMenuItemsA(
      List listItems) {
    List<DropdownMenuItem<ContinentListItem>> items = List();
    for (ContinentListItem listItem in listItems) {
      items.add(
        DropdownMenuItem(
          child: Text(listItem.name),
          value: listItem,
        ),
      );
    }
    return items;
...
floatingActionButton: FloatingActionButton(
        backgroundColor: deepOrange,
        onPressed: () {
          myFocusNode.requestFocus();
          updateUserReportWithUserInfo(state);
          changeScreen(context, BottomNavBarController());
       ...
      
            TextField(
              focusNode: myFocusNode,
              onChanged: (value) => state.displayName = value,
            ),
            
            DropdownButtonHideUnderline(
              child: DropdownButton(
                  value: selectedItemA,
                  items: _dropdownMenuItemsA,
                  onChanged: (value) {
                    setState(() {
                      selectedItemA = value;
                      print(selectedItemA.name);
                    });
                  }),
            ),
            ...
            
            DropdownButtonHideUnderline(
              child: DropdownButton(
                  value: selectedItemB,
                  items: _dropdownMenuItemsB,
                  onChanged: (value) {
                    setState(() {
                      selectedItemB = value;
                      print(selectedItemB.name);
                    });

class ContinentListItem {
  int value;
  String name;

  ContinentListItem({this.value, this.name});
}
         

标签: firebaseflutterdartgoogle-cloud-firestore

解决方案


我通过添加state.selectedItemA = selectedItemA.name;如下解决了它:

                    setState(() {
                      selectedItemA = value;
                    });
                    state.selectedItemA = selectedItemA.name;
                  }),

推荐阅读