dart - Flutter populate dropdown button from json array

Question

How do I populate this JSON list into dropdown button?

{
    "status": true,
    "message": "success",
    "data": {
        "list": [
            {
                "idattribute": "2",
                "attrName": "BBQ"
            },
            {
                "idattribute": "1",
                "attrName": "FRUIT JUICE"
            }
        ]
    }
}

Answer 1

class _YourPageState extends State<YourPage> {
  Map yourJson = {
    "status": true,
    "message": "success",
    "data": {
      "list": [
        {"idattribute": "2", "attrName": "BBQ"},
        {"idattribute": "1", "attrName": "FRUIT JUICE"}
      ]
    }
  };
  int _value = 1;
  List<DropdownMenuItem<int>> _menuItems;

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

    List dataList = yourJson["data"]["list"];
    _menuItems = List.generate(
      dataList.length,
          (i) => DropdownMenuItem(
        value: int.parse(dataList[i]["idattribute"]),
        child: Text("${dataList[i]["attrName"]}"),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: DropdownButton<int>(
          items: _menuItems,
          value: _value,
          onChanged: (value) => setState(() => _value = value),
        ),
      ),
    );
  }
}