我是 Flutter 新手,有人可以帮助我吗?当我选择第一个下拉菜单,然后选择第二个下拉菜单,然后再次选择第一个下拉菜单时,出现冻结错误,我已经将变量列表设置为空,但仍然不起作用,出现错误:
应该只有一个项目具有 dropdownbutton 的值,检测到零个或两个或更多具有相同值的 [DropdownMenuItem]
这是我的代码:
主程序
import 'package:flutter/material.dart';
import 'package:perhitungan_pkt_kgb/data.dart';
class HitungPkt extends StatefulWidget {
const HitungPkt({super.key});
@override
State<HitungPkt> createState() => _HitungPktState();
}
class _HitungPktState extends State<HitungPkt> {
@override
Widget build(BuildContext context) {
return Form(
child: Column(
children: [
_buildDropdown(
label: 'Gol',
items: Data.gol.cast<Map<String, dynamic>>(),
onChanged: (String? newValue) {
setState(() {
// value dropdown nya kita masukan ke sebuah variabel
Data.golValue = newValue;
Data.vehicle?.clear();
Data.vehicle = Data.cekgol();
});
}),
if (Data.vehicle != null)
_buildDropdown(
label: 'Vechile',
items: Data.vehicle!.cast<Map<String, dynamic>>(),
onChanged: (String? newValue) {
setState(() {
// value dropdown nya kita masukan ke sebuah variabel
Data.vehicleValue = newValue;
});
}),
],
),
);
}
Widget _buildDropdown({
required String label,
required List<Map<String, dynamic>> items,
required void Function(String?) onChanged,
String? value,
}) {
return DropdownButtonFormField<String>(
decoration: InputDecoration(
labelText: label,
hintStyle: const TextStyle(color: Colors.blue),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
borderSide: const BorderSide(color: Colors.blue),
),
focusedBorder: OutlineInputBorder(
borderSide: const BorderSide(color: Colors.blue),
borderRadius: BorderRadius.circular(10),
),
enabledBorder: OutlineInputBorder(
borderSide: const BorderSide(color: Colors.blue),
borderRadius: BorderRadius.circular(10),
),
errorBorder: OutlineInputBorder(
borderSide: const BorderSide(color: Colors.blue),
borderRadius: BorderRadius.circular(10),
),
),
value: value,
items: items.map((item) {
return DropdownMenuItem<String>(
value: item['value'] as String,
child: Text(item['label'] as String),
);
}).toList(),
onChanged: onChanged);
}
}
数据.dart
class Data{
static const List gol = [
{'value': 'Car', 'label': 'Car'},
{'value': 'Bus', 'label': 'Bus'},
{'value': 'Plane', 'label': 'Plane'}
];
static String? golValue;
static String? vehicleValue;
static List? vehicle;
static List cekgol() {
if (golValue == 'Car') {
return [
{'value': 'car1', 'label': 'car1'},
{'value': 'car2', 'label': 'car2'},
{'value': 'car3', 'label': 'car3'},
{'value': 'car4', 'label': 'car4'},
{'value': 'car5', 'label': 'car5'}
];
} else if (golValue == 'Bus') {
return [
{'value': 'Bus1', 'label': 'Bus1'},
{'value': 'Bus2', 'label': 'Bus2'},
{'value': 'Bus3', 'label': 'Bus3'},
{'value': 'Bus4', 'label': 'Bus4'}
];
} else if (golValue == 'Plane') {
return [
{'value': 'Plane1', 'label': 'Plane1'},
{'value': 'Plane2', 'label': 'Plane2'},
{'value': 'Plane3', 'label': 'Plane3'},
{'value': 'Plane4', 'label': 'Plane4'},
{'value': 'Plane5', 'label': 'Plane5'}
];
} else {
return [];
}
}
}
出现此问题的原因是,您可能将 DropdownButtonFormField 的值设置为您提供的项目列表中不存在的值。当您更改第一个下拉菜单 (Gol) 时,您正确地清除了车辆列表,但您没有重置 vehicleValue。这意味着第二个下拉菜单尝试使用新填充的车辆列表中不再存在的 vehicleValue 进行渲染,从而导致错误。