如何在Flutter中将DropdownButton的第一项设置为来自第一个API的值,而将其余项设置为来自第二个API的值?

时间:2019-08-21 03:18:51

标签: flutter

DropdownButton(       isExpanded:是的,       iconEnabledColor:Colors.orange,       项目:[

    //From First API
    DropdownMenuItem(
      value: title,
      child: Text(title), 
    ),


    //From Second API
    snapshot.data.title
        .map((title) => DropdownMenuItem<Title>(
      child: Row(
        children: <Widget>[
          Text(title.title),
        ],
      ),
      value: title,
    ))
        .toList()
  ],
  onChanged: (value) {
    setState(() {
      selectedTitle = value;
    });
  },

  value: selectedTitle,
)

我希望这两个结果在一个DropdownButton中:

DropdownButton 1:

MS

DropdownButton 2:

夫人 先生 女士 SIR

预期结果:

DropdownButton:

MS 夫人 先生 女士 SIR

这是我得到的错误:

lib / account / updateProfileTab / DropDownPage2.dart:155:28:错误:“列表>”类型的值不能分配给“ DropdownMenuItem”类型的变量。

  • “列表”来自“ dart:core”。

  • 'DropdownMenuItem'来自'package:flutter / src / material / dropdown.dart'('file:/// C:/ src / flutter / packages / flutter / lib / src / material / dropdown。 dart”)。

  • “标题”来自“ package:test / test / update / DropDownPage2.dart”(“ lib / test / update / DropDownPage2.dart”)。

尝试更改左侧的类型,或将右侧投射到“ DropdownMenuItem”。                           .toList()

1 个答案:

答案 0 :(得分:0)

如果我了解您的意思,

第1步:获取json字符串并从API1和API2生成列表,

List<Map> _jsonApi1 = [{"id":0,"name":"default 1"}];
List<Map> _jsonApi2 = [{"id":1,"name":"second 2"},{"id":2,"name":"third 3"}];

第2步:来自API1和API2的联接列表,

List<Map> _myJson = new List.from(_jsonApi1)..addAll(_jsonApi2);

第3步:生成DropdownMenuItem

@override
Widget build(BuildContext context) {
return new Scaffold(
  body: new Center(
    child: new DropdownButton<String>(
      isDense: true,
      hint: new Text("Select"),
      value: _mySelection,
      onChanged: (String newValue) {

        setState(() {
          _mySelection = newValue;
        });

        print (_mySelection);
      },
      items: _myJson.map((Map map) {
        return new DropdownMenuItem<String>(
          value: map["id"].toString(),
          child: new Text(
            map["name"],
          ),
        );
      }).toList(),
    ),
  ),
);

}

完整代码

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // This is the theme of your application.
        //
        // Try running your application with "flutter run". You'll see the
        // application has a blue toolbar. Then, without quitting the app, try
        // changing the primarySwatch below to Colors.green and then invoke
        // "hot reload" (press "r" in the console where you ran "flutter run",
        // or simply save your changes to "hot reload" in a Flutter IDE).
        // Notice that the counter didn't reset back to zero; the application
        // is not restarted.
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

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

  // This widget is the home page of your application. It is stateful, meaning
  // that it has a State object (defined below) that contains fields that affect
  // how it looks.

  // This class is the configuration for the state. It holds the values (in this
  // case the title) provided by the parent (in this case the App widget) and
  // used by the build method of the State. Fields in a Widget subclass are
  // always marked "final".

  final String title;

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

List<Map> _jsonApi1 = [{"id":0,"name":"default 1"}];
List<Map> _jsonApi2 = [{"id":1,"name":"second 2"},{"id":2,"name":"third 3"}];
List<Map> _myJson = new List.from(_jsonApi1)..addAll(_jsonApi2);

class _MyHomePageState extends State<MyHomePage> {

  String _mySelection;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Center(
        child: new DropdownButton<String>(
          isDense: true,
          hint: new Text("Select"),
          value: _mySelection,
          onChanged: (String newValue) {

            setState(() {
              _mySelection = newValue;
            });

            print (_mySelection);
          },
          items: _myJson.map((Map map) {
            return new DropdownMenuItem<String>(
              value: map["id"].toString(),
              child: new Text(
                map["name"],
              ),
            );
          }).toList(),
        ),
      ),
    );

  }
}

enter image description here