如何在下拉列表中获取所选选项的状态并在 Firebase 中显示

Question

I have a user input and two select option dropdowns. I retrieved the displayName (user input value) from the state and displayed it in Firestore db, however, I can't get the selected options ( selectedItemA and selectedItemB ) from the state and display them in the db.

How can I get these values ( selectedItemA and selectedItemB ) displayed in the db?

state

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
    }),
  );
}

profile screen

@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});
}
         

Answer 1

I solved it by adding state.selectedItemA = selectedItemA.name; as follows:

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