面临下拉按钮抖动的问题

Question

iam计划使乡村-州-城市依赖下拉列表。一切都很好，当我点击乡村下拉列表时，它看起来也很好。。我可以选择它的州。之后，如果我选择另一个国家，它将显示错误。我不明白真正的问题是什么。请帮帮我。这是我的密码。。。

import 'package:flutter/material.dart';
import 'package:states_lga/mode.dart';
import 'package:states_lga/repository.dart';
import 'package:states_lga/staterespo.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Home(),
);
}
}
class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
// String dropdownValue = "india";
String dropdownValue1 = "select a country";
String dropdownValue2 = "select a state";
List<String> city = ["india", "gjhjgh", "dhdtytd"];
var countries = ["select a country"];
var states = ["select a state"];
int i = 0;
var countrystate = example.countryStateCity;
@override
void initState() {
countrystate.forEach((doc) {
// print(doc["country"]);
countries.add(doc["country"]);
// print(doc);
});
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("STATES MULTI DROPDOWN"),
elevation: 0.1,
),
body: SafeArea(
child: Container(
padding: EdgeInsets.symmetric(horizontal: 50, vertical: 30),
child: Column(
children: <Widget>[
new DropdownButton<String>(
underline: Container(
height: 0,
),
isExpanded: true,
items: countries.map<DropdownMenuItem<String>>((String value1) {
return DropdownMenuItem<String>(
value: value1,
child: Padding(
// padding: EdgeInsets.all(ScreenUtil().setWidth(10.0)),
padding: EdgeInsets.all(10),
child: Text(
value1,
style: TextStyle(
// color: HexColor("#1C2344"),
// fontSize: ScreenUtil().setSp(12),
fontFamily: 'Poppins-ExtraLight'),
),
),
);
}).toList(),
onChanged: (String newValue) async {
setState(() {
// print(newValue);
var user;
var stateCityObject =
countrystate.where((obj) => obj["country"] == newValue);
List<String> dynamicStates = [];
stateCityObject.forEach((doc) async {
// print(doc["states"]);
user = doc["states"];
states = ["select a state"];
user.forEach((key, value) async {
// print(key);
dynamicStates.add(key);
print(dynamicStates);
});
// }
});
states = states + dynamicStates;
dropdownValue1 = newValue;
print("this is after..." + dropdownValue1);
states = ["select a state"] + dynamicStates;
print(states);
});
},
value: dropdownValue1,
),
new DropdownButton<String>(
underline: Container(
height: 0,
),
isExpanded: true,
items: states.map<DropdownMenuItem<String>>((String value) {
// print(dropdownValue1);
print(value);
// print(countries);
return DropdownMenuItem<String>(
value: value,
child: Padding(
padding: EdgeInsets.all(10),
child: Text(
value,
style: TextStyle(
fontFamily: 'Poppins-ExtraLight'),
),
),
);
}).toList(),
onChanged: (String newValue) {
setState(() {
print(newValue);
dropdownValue2 = newValue;
});
},
value: dropdownValue2,
)
],
),
),
),
);
}
}

duumy数据：

class example{

static List<Map<String, Object>> countryStateCity = [
{
"id": 1,
"country": "Afghanistan",
"iso3": "AFG",
"iso2": "AF",
"phone_code": "93",
"capital": "Kabul",
"currency": "AFN",
"states": {
"Badakhshan": [
"Ashkāsham",
"Fayzabad",
"Jurm",
"Khandūd",
"Rāghistān",
"Wākhān"
],
"Badghis": ["Ghormach", "Qala i Naw"],
"Baghlan": [
"Ḩukūmatī Dahanah-ye Ghōrī",
"Baghlān",
"Nahrīn",
"Pul-e Khumrī"
],
"Balkh": [
"Balkh",
"Dowlatābād",
"Khulm",
"Lab-Sar",
"Mazār-e Sharīf",
"Qarchī Gak"
],
"Bamyan": ["Bāmyān", "Panjāb"],
"Daykundi": ["Nīlī"],
"Farah": ["Farah"],
"Faryab": ["Andkhōy", "Maymana"],
"Ghazni": ["Ghazni"],
"Ghōr": ["Fayrōz Kōh", "Shahrak"],
"Helmand": [
"‘Alāqahdārī Dīshū",
"Gereshk",
"Lashkar Gāh",
"Markaz-e Ḩukūmat-e Darwēshān",
"Sangīn"
],
"Herat": [
"Chahār Burj",
"Ghōriyān",
"Herāt",
"Kafir Qala",
"Karukh",
"Kuhsān",
"Kushk",
"Qarah Bāgh",
"Shīnḏanḏ",
"Tīr Pul",
"Zindah Jān"
],
"Jowzjan": ["Āqchah", "Darzāb", "Qarqīn", "Shibirghān"],
"Kabul": ["Kabul", "Mīr Bachah Kōṯ", "Paghmān"],
"Kandahar": ["Kandahār"],
"Kapisa": ["Sidqābād"],
"Khost": ["Khōst"],
"Kunar": ["Asadābād", "Āsmār"],
"Kunduz Province": [
"Dasht-e Archī",
"Imām Şāḩib",
"Khanabad",
"Kunduz",
"Qarāwul"
],
"Laghman": ["Mehtar Lām"],
"Logar": ["Ḩukūmatī Azrah", "Baraki Barak", "Pul-e ‘Alam"],
"Nangarhar": ["Bāsawul", "Jalālābād", "Markaz-e Woluswalī-ye Āchīn"],
"Nimruz": ["Khāsh", "Mīrābād", "Rūdbār", "Zaranj"],
"Nuristan": ["Pārūn"],
"Paktia": ["Gardez"],
"Paktika": ["Saṟōbī", "Zaṟah Sharan", "Zarghūn Shahr"],
"Panjshir": ["Bāzārak"],
"Parwan": ["Charikar", "Jabal os Saraj"],
"Samangan": ["Aībak"],
"Sar-e Pol": [
"Chīras",
"Larkird",
"Qal‘ah-ye Shahr",
"Sang-e Chārak",
"Sar-e Pul",
"Tagāw-Bāy",
"Tukzār"
],
"Takhar": ["Ārt Khwājah", "Taloqan"],
"Urozgan": ["Tarinkot", "Uruzgān"],
"Zabul": ["Qalāt"]
}
},
{
"id": 2,
"country": "Aland Islands",
"iso3": "ALA",
"iso2": "AX",
"phone_code": "+358-18",
"capital": "Mariehamn",
"currency": "EUR",
"states": {"no states": "hi"}
},
];
}```

Answer 1

您好，主要问题是当您从国家中选择另一个值时，您需要清除州的值，并将状态下拉值改回"选择状态">

像这个

class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
// String dropdownValue = "india";
String dropdownValue1 = "select a country";
String dropdownValue2 = "select a state";
List<String> city = ["india", "gjhjgh", "dhdtytd"];
var countries = ["select a country"];
var states = ["select a state"];
int i = 0;
var countrystate = example.countryStateCity;
@override
void initState() {
countrystate.forEach((doc) {
// print(doc["country"]);
countries.add(doc["country"]);
// print(doc);
});
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("STATES MULTI DROPDOWN"),
elevation: 0.1,
),
body: SafeArea(
child: Container(
padding: EdgeInsets.symmetric(horizontal: 50, vertical: 30),
child: Column(
children: <Widget>[
new DropdownButton<String>(
underline: Container(
height: 0,
),
isExpanded: true,
items: countries.map<DropdownMenuItem<String>>((String value1) {
return DropdownMenuItem<String>(
value: value1,
child: Padding(
// padding: EdgeInsets.all(ScreenUtil().setWidth(10.0)),
padding: EdgeInsets.all(10),
child: Text(
value1,
style: TextStyle(
// color: HexColor("#1C2344"),
// fontSize: ScreenUtil().setSp(12),
fontFamily: 'Poppins-ExtraLight'),
),
),
);
}).toList(),
onChanged: (String newValue) async {
setState(() {
// print(newValue);
var user;
var stateCityObject =
countrystate.where((obj) => obj["country"] == newValue);
List<String> dynamicStates = [];
stateCityObject.forEach((doc) async {
// print(doc["states"]);
user = doc["states"];
states = ["select a state"];
user.forEach((key, value) async {
// print(key);
dynamicStates.add(key);
print(dynamicStates);
});
// }
});
dropdownValue1 = newValue;
print("this is after..." + dropdownValue1);

states.clear(); //Where  I cleared the states list
states = ["select a state"] + dynamicStates;
dropdownValue2 = "select a state"; // This is where I set the value to the default value for state
print(states);
});
},
value: dropdownValue1,
),
new DropdownButton<String>(
underline: Container(
height: 0,
),
isExpanded: true,
items: states.map<DropdownMenuItem<String>>((String value) {
// print(dropdownValue1);
print(value);
// print(countries);
return DropdownMenuItem<String>(
value: value,
child: Padding(
padding: EdgeInsets.all(10),
child: Text(
value,
style: TextStyle(
fontFamily: 'Poppins-ExtraLight'),
),
),
);
}).toList(),
onChanged: (String newValue) {
setState(() {
print(newValue);
dropdownValue2 = newValue;
});
},
value: dropdownValue2,
)
],
),
),
),
);
}
}