Provider does not refresh the list of a DropDownMenu - Flutter - flutter

Question

I have a personal API from where I retrieve all the information I need, the connection works fine, but the problem is when I want to show this values, I have a provider where I put all the data I need from the API, and I call it to put those items in the DropDownMenu, but the problem is that the values does not appear, even after the data have arrived, I know this thanks to debugging, here is some code:
this is the code of the widget where I'm calling the provider:
Column(
children: [
Container(
color: Colors.green,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
margin: const EdgeInsets.only(top: 20, bottom: 20),
height: 10,
width: 100,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.grey),
)
]),
),
IconList(
labelText: 'Landmarks',
icon: Icons.panorama_horizontal_outlined,
items: context.watch<Landmarks>().getLandmarksNameList(), //Here is my provider
),
const IconInput(
labelText: '1', icon: Icons.addchart_outlined),
const IconInput(
labelText: '1', icon: Icons.addchart_outlined),
ListView.builder(
physics: const NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemCount: 2,
itemBuilder: (BuildContext context, int index) {
return UserCard(user: usersList[index]);
},
),
],
),
this is the widget iconList, where I have the dropDownMenu:
import 'package:flutter/material.dart';
class IconList extends StatefulWidget {
final String labelText;
final IconData icon;
final List<String> items = [];
IconList({super.key, required this.labelText, required this.icon, items});
#override
State<IconList> createState() => _IconListState();
}
class _IconListState extends State<IconList> {
#override
Widget build(BuildContext context) {
String selectedItem = '';
if (widget.items.isNotEmpty) {
selectedItem = widget.items.first;
}
return Container(
margin: const EdgeInsets.all(10.0),
child: Row(
children: [
Icon(widget.icon),
DropdownButton<String>(
value: selectedItem,
items: widget.items.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (String? value) {
setState(() {
selectedItem = value!;
});
},
),
],
),
);
}
}
And this is my provider:
class Landmarks with ChangeNotifier {
final List<Landmark> _items = [];
List<Landmark> get landmarks => _items;
void addLandmarks(List<Landmark> value) {
_items.addAll(value);
notifyListeners();
}
List<String> getLandmarksNameList() {
List<String> list = [];
print(_items.length);
for (int i = 0; i < _items.length; i++) {
list.add(_items[i].name);
}
return list;
}
}

Answer 1

You have two problems with you code:
Problem 1
In your IconList constructor
IconList({super.key, required this.labelText, required this.icon, items});
you are accessing items, but really you should access this.items.
To do so, you also shouldn't initialize items with:
final List<String> items = [];
Your code should look like this:
class IconList extends StatefulWidget {
final String labelText;
final IconData icon;
final List<String> items;
IconList(
{super.key,
required this.labelText,
required this.icon,
required this.items});
Problem 2
Within your build method:
#override
Widget build(BuildContext context) {
String selectedItem = '';
if (widget.items.isNotEmpty) {
selectedItem = widget.items.first;
}
you are initializing selectedItem, which means that every setState, selectedItem will get reset to its original value since it's within the build method. Instead, move selectedItem to outside the build, to your _state class:
class _IconListState extends State<IconList> {
String selectedItem = ''; //<-- Initialize it here
#override
Widget build(BuildContext context) {
if (widget.items.isNotEmpty) {
selectedItem = widget.items.first;
}
return Container(
Your IconList should look like this:
class IconList extends StatefulWidget {
final String labelText;
final IconData icon;
final List<String> items;
IconList(
{super.key,
required this.labelText,
required this.icon,
required this.items});
#override
State<IconList> createState() => _IconListState();
}
class _IconListState extends State<IconList> {
String selectedItem = ''; //<-- Initialize it here
#override
Widget build(BuildContext context) {
if (widget.items.isNotEmpty) {
selectedItem = widget.items.first;
}
return Container(
margin: const EdgeInsets.all(10.0),
child: Row(
children: [
Icon(widget.icon),
DropdownButton<String>(
value: selectedItem,
items: widget.items.map<DropdownMenuItem<String>>((String value) {
print("item is $value");
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (String? value) {
setState(() {
selectedItem = value!;
});
},
),
],
),
);
}
}