如何在颤振的下拉菜单中进行选择？

Question

I am implementing the Dropdown which is populated from API. Data is populated successfully into the dropdown but when I select any item I am getting this error. Guys can anyone please help me?

Error: There should be exactly one item with [DropdownButton]'s value: Instance of 'Make'. Either zero or 2 or more [DropdownMenuItem]s were detected with the same value.

FutureBuilder<List<Make>>(
                      future: _fetchBrand(),
                      builder: (BuildContext context,
                          AsyncSnapshot<List<Make>> snapshot) {
                        if (!snapshot.hasData) return CircularProgressIndicator();
                        return DropdownButtonFormField<Make>(
                          isDense: true,
                          decoration: spinnerDecoration('Select Car Brand'),
                          items: snapshot.data
                              .map((user) => DropdownMenuItem<Make>(
                            child: Text(user.make),
                            value: user,
                          ))
                              .toList(),
                          onChanged: (Make newVal) {
                            setState(() {
                              makeModel = newVal;
                            });
                          },
                          value: makeModel,
                        );
                      }),

Future<List<Make>> _fetchBrand() async {
    var response = await http.get(url);

    if (response.statusCode == 200) {
      final items = json.decode(response.body).cast<Map<String, dynamic>>();
      print(items);
      List<Make> listOfUsers = items.map<Make>((json) {
        return Make.fromJson(json);
      }).toList();

      return listOfUsers;
    } else {
      throw Exception('Failed to load internet');
    }
  }

class Make {
  String makeid;
  String make;

  Make(
      {this.makeid,
        this.make,});

  Make.fromJson(Map<String, dynamic> json) {
    makeid = json['makeid'];
    make = json['make'];
  }
}

Answer 1

You can copy paste run full code below
Reason
https://github.com/flutter/flutter/issues/11426#issuecomment-414047398
didUpdateWidget of the FutureBuilder state is being called every time a rebuild is issued. This function checks if the old future object is different from the new one

Solution
You can declare a Future and init in initState and in FutureBuilder use this future

code snippet

Make makeModel = null;
Future _future;

@override
  void initState() {
    _future = _fetchBrand();
    super.initState();
  }

body: FutureBuilder<List<Make>>(
          future: _future,  

working demo

full code

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

class Make {
  String makeid;
  String make;

  Make({
    this.makeid,
    this.make,
  });

  Make.fromJson(Map<String, dynamic> json) {
    makeid = json['makeid'];
    make = json['make'];
  }
}

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  Make makeModel = null;
  Future _future;
  Future<List<Make>> _fetchBrand() async {
    String response = '''
    [
{
    "makerid" : "a",
    "make" : "a1"
},
{
    "makerid" : "b",
    "make" : "b1"
}
]
    ''';

    final items = json.decode(response).cast<Map<String, dynamic>>();
    print(items);
    List<Make> listOfUsers = items.map<Make>((json) {
      return Make.fromJson(json);
    }).toList();

    return listOfUsers;

    /*var response = await http.get(url);

    if (response.statusCode == 200) {
      final items = json.decode(response.body).cast<Map<String, dynamic>>();
      print(items);
      List<Make> listOfUsers = items.map<Make>((json) {
        return Make.fromJson(json);
      }).toList();

      return listOfUsers;
    } else {
      throw Exception('Failed to load internet');
    }*/
  }

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  void initState() {
    _future = _fetchBrand();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: FutureBuilder<List<Make>>(
          future: _future,
          builder: (BuildContext context, AsyncSnapshot<List<Make>> snapshot) {
            if (!snapshot.hasData) return CircularProgressIndicator();
            return DropdownButtonFormField<Make>(
              isDense: true,
              decoration: InputDecoration(
                  fillColor: Colors.blue.shade100,
                  filled: true,
                  labelText: 'Select Car Brand'),
              items: snapshot.data
                  .map((user) => DropdownMenuItem<Make>(
                        child: Text(user.make),
                        value: user,
                      ))
                  .toList(),
              onChanged: (Make newVal) {
                setState(() {
                  print(newVal.toString());
                  makeModel = newVal;
                });
              },
              value: makeModel,
            );
          }),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}