0

我正在实现相应的下拉菜单（第二个下拉菜单的选项取决于第一个下拉菜单），它使用这种格式的对象列表：

List<State> states = [
  new State(stateId: 1, stateName: "New York", cities: [
    new City(cityId: 1, cityName: "New York City"),
    new City(cityId: 2, cityName: "Buffalo") ...

小部件代码是这样的：

children: <Widget>[
                DropdownButtonFormField<int>(
                  decoration: InputDecoration(labelText: 'State'),
                  value: selectedStateId,
                  items: states.map((State state) {
                    return new DropdownMenuItem<int>(
                      value: state.stateId,
                      child: new Text(states.singleWhere((x) => x.stateId == state.stateId).stateName),
                    );
                  }).toList(),
                  onChanged: (int newStateId) {
                    setState(() {
                      this.selectedCityId = states.singleWhere((x) => x.stateId == newStateId).cities[0].cityId; // set to first city for this state
                      this.selectedStateId = = newStateId;
                    });
                  },
                ),
                DropdownButtonFormField<int>(
                  decoration: InputDecoration(labelText: 'City'),
                  value: selectedCityId,
                  items: states.singleWhere((x) => x.stateId == selectedStateId)
                      .cities
                      .map((City city) {
                    return new DropdownMenuItem<int>(
                      value: city.cityId,
                      child: new Text(states
                          .singleWhere((x) => x.stateId == selectedStateId).cities.singleWhere((x) => x.cityId == city.cityId).cityName),
                    );
                  }).toList(),
                  onChanged: (int newCityId) {
                    setState(() {
                      this.selectedCityId = newCityId;
                    });
                  },
                )
              ],

当我在此示例中更改状态下拉列表时，我收到一个错误：“应该恰好有一个项目具有 [DropdownButton] 的值：1。检测到零或 2 个或多个 [DropdownMenuItem] 具有相同的值”。

上述错误中的“1”对应于更改状态之前选择的城市值，所以我知道该错误与它仍在寻找旧的 selectedCityId 并且它不再在项目列表中的事实有关，但我不确定为什么我在 setState 中更改了该值。我相信，这个问题的一个关键是，如果我只是将 DropDownButtonFormField 更改为常规 DropDownButtons，那么完全相同的代码就可以工作，但我想使用前者附带的内置标签文本。

4

2 回答 2

2

编辑
您可以使用key: UniqueKey()int CityDropdownButtonFormField

DropdownButtonFormField<int>(
      key: UniqueKey(),
      decoration: InputDecoration(labelText: 'City'),

你可以在下面复制粘贴运行完整代码
你可以设置selectedStateId和selectedCityId到states的属性
你不能直接设置为一个值selectedStateId = 1，因为系统会比较地址
代码片段

  int selectedStateId;
  int selectedCityId;

  @override
  void initState() {
    selectedStateId = states[0].stateId;
    selectedCityId = states[0].cities[0].cityId;
    super.initState();
  }

工作演示

在此处输入图像描述

完整代码

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      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 City {
  int cityId;
  String cityName;
  City({this.cityId, this.cityName});
}

class CountryState {
  int stateId;
  String stateName;
  List<City> cities;
  CountryState({this.stateId, this.stateName, this.cities});
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

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

  List<CountryState> states = [
    CountryState(stateId: 1, stateName: " York", cities: [
      City(cityId: 1, cityName: "York City"),
      City(cityId: 2, cityName: "Buffalo")
    ]),
    CountryState(stateId: 2, stateName: "A", cities: [
      City(cityId: 3, cityName: "A1"),
      City(cityId: 4, cityName: "A2")
    ])
  ];

  int selectedStateId;
  int selectedCityId;

  @override
  void initState() {
    selectedStateId = states[0].stateId;
    selectedCityId = states[0].cities[0].cityId;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            DropdownButtonFormField<int>(
              decoration: InputDecoration(labelText: 'State'),
              value: selectedStateId,
              items: states.map((CountryState state) {
                return DropdownMenuItem<int>(
                  value: state.stateId,
                  child: Text(states
                      .singleWhere((x) => x.stateId == state.stateId)
                      .stateName),
                );
              }).toList(),
              onChanged: (int StateId) {
                setState(() {
                  this.selectedCityId = states
                      .singleWhere((x) => x.stateId == StateId)
                      .cities[0]
                      .cityId; // set to first city for this state
                  this.selectedStateId = StateId;
                });
              },
            ),
            DropdownButtonFormField<int>(
              key: UniqueKey(),
              decoration: InputDecoration(labelText: 'City'),
              value: selectedCityId,
              items: states
                  .singleWhere((x) => x.stateId == selectedStateId)
                  .cities
                  .map((City city) {
                return DropdownMenuItem<int>(
                  value: city.cityId,
                  child: Text(states
                      .singleWhere((x) => x.stateId == selectedStateId)
                      .cities
                      .singleWhere((x) => x.cityId == city.cityId)
                      .cityName),
                );
              }).toList(),
              onChanged: (int CityId) {
                setState(() {
                  this.selectedCityId = CityId;
                });
              },
            )
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}
于 2020-08-28T07:08:59.557 回答
0

我在 Flutter 问题板上发布了这个示例，它们无法在最新的稳定版本（截至本评论的 1.20.2）上复制。我升级了我的颤振版本（我在 1.17.1 上）并且相同的代码运行没有问题，所以对于遇到同样问题的任何人，我建议更新你的颤振版本。

于 2020-09-01T21:16:49.870 回答