Selected value from DropdownButton not showing in Flutter - flutter

Question

I have a DropdownButton which displays user type.
List<String> items = ['Engineer', 'Technician', 'Sales'];
String? currentSelectedValue;
child: DropdownButtonHideUnderline(
child: Padding(
padding:
const EdgeInsets.symmetric(horizontal: 20.0),
child: DropdownButton<String>(
dropdownColor: Colors.blue.shade100,
isExpanded: true,
hint: Text('Select the user Type'),
onChanged: (newValue) {
setState(() {
currentSelectedValue = newValue;
});
print(currentSelectedValue);
},
items: items.map((String value) {
return DropdownMenuItem(
value: value,
child: Text(
value,
style: TextStyle(color: Colors.black),
),
);
}).toList(),
value: currentSelectedValue,
),
),
),
I can see the list, but when I select a value, it is not displaying on the Text portion of the DropdownButton. I could see the selected value printed in the console.
Can anyone help me to find the mistake?

Answer 1

Make sure to put currentSelectedValue outside the build method.
class Ft extends StatefulWidget {
const Ft({super.key});
#override
State<Ft> createState() => _FtState();
}
class _FtState extends State<Ft> {
List<String> items = ['Engineer', 'Technician', 'Sales'];
String? currentSelectedValue;
#override
Widget build(BuildContext context) {
return Scaffold(
body: DropdownButtonHideUnderline(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
child: DropdownButton<String>(
dropdownColor: Colors.blue.shade100,
isExpanded: true,
hint: Text('Select the user Type'),
onChanged: (newValue) {
setState(() {
currentSelectedValue = newValue;
});
print(currentSelectedValue);
},
items: items.map((String value) {
return DropdownMenuItem(
value: value,
child: Text(
value,
style: TextStyle(color: Colors.black),
),
);
}).toList(),
value: currentSelectedValue,
),
),
),
);
}
}