我在 ListView 中創建了 DropdownBotton 并且我有一個需要在 DropdownMenuItem 中顯示的值串列。
我有兩個關于 DropdownBotton 的問題，
- 如何為我的場景在 DropdownButton 中設定默認值。
- （控制臺錯誤）
There should be exactly one item with [DropdownButton]'s value: $ 5.50 Pineapple Jack (S).
Either zero or 2 or more [DropdownMenuItem]s were detected with the same value
'package:flutter/src/material/dropdown.dart':
Failed assertion: line 915 pos 15: 'items == null || items.isEmpty || value == null ||
items.where((DropdownMenuItem<T> item) {
return item.value == value;
}).length == 1'
下面是我的代碼：
ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
physics: const ScrollPhysics(),
itemCount: snapshot.data!.length,
itemBuilder: (_, index) {
List<String> selectedItemValue = <String>[
("\$${snapshot.data![index].price} ${snapshot.data![index].productType.type1}"),
("\$${snapshot.data![index].price} ${snapshot.data![index].productType.type2}"),
("\$${snapshot.data![index].price} ${snapshot.data![index].productType.type3}")];
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: const EdgeInsets.symmetric(
horizontal: 10, vertical: 5),
padding: const EdgeInsets.all(5.0),
child: DropdownButtonHideUnderline(
child: DropdownButton<String>(
value: dropdownValue,
items: selectedItemValue.map((dropValue) {
return DropdownMenuItem<String>(
value: dropValue,
child: Text(dropValue),
);
}).toList(),
onChanged:
(newDropdownValue) {
setState(() {
dropdownValue =
newDropdownValue!;
print(
'dropdown: $dropdownValue');
});
},
),
),
),
],
);
}
),
請有人幫助我解決這個問題，提前致謝。
uj5u.com熱心網友回復：
DropdownButton' 的值在DropdownMenuItem' 值中應該是唯一的，并且DropDownMenuItem專案中必須有一個與 的當前值完全匹配DropDownButton。在您的情況下，您沒有DropdownButton從 selectedItemValue. 因此，您的問題的答案是，
將
DropdownButton您想要的初始值設定為您的默認值selectedItemValue。為避免錯誤，請將您
DropdownButton的分開StatefullWidget（CustomDropdownButton在這種情況下）。更改您的代碼如下。
ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
physics: const ScrollPhysics(),
itemCount: snapshot.data!.length,
itemBuilder: (_, index) {
List<String> selectedItemValue = <String>[
("\$${snapshot.data![index].price} ${snapshot.data![index].productType.type1}"),
("\$${snapshot.data![index].price} ${snapshot.data![index].productType.type2}"),
("\$${snapshot.data![index].price} ${snapshot.data![index].productType.type3}")];
final defaultValue = selectedItemValue[1];
return CustomDropdownButton(defaultValue:defaultValue, values: selectedItemValue, onItemSelected: (value) {print("Selected Item : $value");});
}
),
CustomDropdownButton 班級
class CustomDropdownMenu extends StatefulWidget {
const CustomDropdownMenu(
{Key? key,
required this.defaultValue,
required this.values,
required this.onItemSelected})
: super(key: key);
final dynamic Function(String? selectedValue) onItemSelected;
final String defaultValue;
final List<String> values;
@override
_CustomDropdownMenuState createState() => _CustomDropdownMenuState();
}
class _CustomDropdownMenuState extends State<CustomDropdownMenu> {
late String dropdownValue;
@override
void initState() {
super.initState();
dropdownValue = widget.defaultValue;
}
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: const EdgeInsets.symmetric(horizontal: 10, vertical: 5),
padding: const EdgeInsets.all(5.0),
child: DropdownButtonHideUnderline(
child: DropdownButton<String>(
value: dropdownValue,
items: widget.values.map((dropValue) {
return DropdownMenuItem<String>(
value: dropValue,
child: Text(dropValue),
);
}).toList(),
onChanged: (newDropdownValue) {
setState(() {
dropdownValue = newDropdownValue!;
});
widget.onItemSelected(newDropdownValue);
},
),
),
),
],
);
}
}
uj5u.com熱心網友回復：
您的問題是給您的下拉串列 avalue可能會復制到您的串列中。這意味著您的字串串列可能有多個具有相同字串的專案。要解決這個問題，您需要為value引數指定一個唯一值。在這種情況下，您可以使用陣列的索引，如下面的代碼所示。
我試圖用虛擬串列復制你的代碼，這樣我就可以運行它并測驗它。
class _StarterPageState extends State<StarterPage> {
Map<int, int?> dropdownValues = {};
final List<String> _list = [
'List Item 1',
'List Item 2',
'List Item 3',
'List Item 4',
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
physics: const ScrollPhysics(),
itemCount: _list.length,
itemBuilder: (_, parentListIndex) {
List<String> selectedItemValues = <String>[
'Dropdown Item 1',
'Dropdown Item 2',
'Dropdown Item 3',
'Dropdown Item 4',
];
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
margin: const EdgeInsets.symmetric(horizontal: 10, vertical: 5),
padding: const EdgeInsets.all(5.0),
child: DropdownButtonHideUnderline(
child: DropdownButton<int>(
hint: const Text('Select Item'), // Shown when value is null
// ?? (selectedItemValues.isNotEmpty ? 0 : null) => this adds a default value if the value is null
value: dropdownValues[parentListIndex] ?? (selectedItemValues.isNotEmpty ? 0 : null),
items: List.generate(
selectedItemValues.length,
(i) => DropdownMenuItem<int>(
value: i,
child: Text(selectedItemValues[i]),
),
),
onChanged: (newDropdownValue) {
setState(() {
dropdownValues[parentListIndex] = newDropdownValue!;
print('dropdown: ${dropdownValues[parentListIndex]}');
});
},
),
),
),
],
);
},
),
);
}
}
此外，由于您有多個下拉串列，您需要將下拉串列的值分開，所以這就是我創建具有以下結構的地圖的原因：
{
<parentListIndex>: <dropdownValueIndex>,
<parentListIndex>: <dropdownValueIndex>,
//...
}
您可以像這樣hint向DropdownButton小部件添加引數：
DropdownButton<int>(
hint: const Text('Select Item'),
value: dropdownValueIndex,
//...
)
在此 DartPad https://dartpad.dev/?id=08ace6b8f73cff0216673dcf9def433d 中查看現場演示
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/398577.html