Flutter, How to solve "Expected a value of type 'List<DropdownMenuItem<Object>>?', but got one of type 'List<dynamic>'

I am passing a List of records to a custom DropDown but got the captioned error.

//dataList is a list of record with 2 fields: int id, and String name

Widget DropDownList(dataList, val, ReturnSelectedValue) {
  return DropdownButton(
    value: val,
    isExpanded: true,
    items: dataList.map((item) {
      return DropdownMenuItem(
        value: item.id,
        child: Text(item.name!),
      );
    }).toList(),
    onChanged: (selectedvalue) {
      ReturnSelectedValue(selectedvalue);
    },
  );
}

You can use type inference to ensure that dataList is of the correct type by using the List<DropdownMenuItem<T>>.from constructor.

Widget DropDownList(dataList, val, ReturnSelectedValue) {
  return DropdownButton(
    value: val,
    isExpanded: true,
    items: List<DropdownMenuItem<Object>>.from(dataList.map((item) {
      return DropdownMenuItem(
        value: item.id,
        child: Text(item.name!),
      );
    })),
    onChanged: (selectedvalue) {
      ReturnSelectedValue(selectedvalue);
    },
  );
}

here is the full example:

<img src="https://i.stack.imgur.com/52cpM.gif" width="220">

Code:

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: 'Flutter App',
home: HomePage(),
);
}
}
class HomePage extends StatefulWidget {
const HomePage({super.key});
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
String selectedValue = '1';
List<Data> dataList = [
Data(id: '1', name: 'January'),
Data(id: '2', name: 'February'),
Data(id: '3', name: 'March'),
Data(id: '4', name: 'April'),
Data(id: '5', name: 'May'),
Data(id: '6', name: 'June'),
Data(id: '7', name: 'July'),
Data(id: '8', name: 'August'),
Data(id: '9', name: 'September'),
Data(id: '10', name: 'October'),
Data(id: '11', name: 'November'),
Data(id: '12', name: 'December'),
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Flutter Moment Demo'),
),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
DropDownList(
dataList: dataList,
val: selectedValue,
returnSelectedValue: (String) {
setState(() {
selectedValue = String;
});
print('Selected value: $String');
},
),
Text(dataList.where((element) => element.id == selectedValue).first.name)
],
),
),
);
}
}
class Data {
final String id;
final String name;
Data({required this.id, required this.name});
}
class DropDownList extends StatelessWidget {
final List<Data> dataList;
final String val;
final Function(String) returnSelectedValue;
const DropDownList({
super.key,
required this.dataList,
required this.val,
required this.returnSelectedValue,
});
@override
Widget build(BuildContext context) {
return DropdownButton(
value: val,
isExpanded: true,
items: dataList.map((item) {
return DropdownMenuItem(
value: item.id,
child: Text(item.name),
);
}).toList(),
onChanged: (selectedValue) {
returnSelectedValue.call(selectedValue!);
},
);
}
}