我在一个flutter项目中实现了DropdownButton,并在他们的开发页面Here上复制了代码。虽然它工作得很好(在我的情况下,允许我在一堆图标中循环),但如果我切换到应用程序中的另一个标签并返回到DropdownButton存在的标签,它会重置为初始值List.first。如何保留选定状态并仅在用户更改应用程序中的值时更改它?提前感谢您的任何建议!:)
DropdownButton
List.first
xbp102n01#
要在flutter中导航期间保留Dropdownbutton的值,可以将所选值保存在有状态小部件的状态中,并在重建DropDownButton时使用该值初始化DropDownButton。
Dropdownbutton
DropDownButton
class MyDropdownButton extends StatefulWidget { @override _MyDropdownButtonState createState() => _MyDropdownButtonState(); } class _MyDropdownButtonState extends State<MyDropdownButton> { String _selectedValue = 'Option 1'; @override Widget build(BuildContext context) { return DropdownButton<String>( value: _selectedValue, items: [ DropdownMenuItem(value: 'Option 1', child: Text('Option 1')), DropdownMenuItem(value: 'Option 2', child: Text('Option 2')), DropdownMenuItem(value: 'Option 3', child: Text('Option 3')), ], onChanged: (value) { setState(() { _selectedValue = value!; }); }, ); } }
在Scaffold中使用MyDropdownButton小部件,并用ValueListenableBuilder Package 它。ValueListenableBuilder侦听对ValueNotifier的更改,并在值更改时重新构建DropdownButton
MyDropdownButton
ValueListenableBuilder
ValueNotifier
class MyHomePage extends StatelessWidget { final ValueNotifier<String> selectedValue = ValueNotifier('Option 1'); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('My App'), ), body: ValueListenableBuilder<String>( valueListenable: selectedValue, builder: (context, value, _) { return Column( children: [ MyDropdownButton(), ElevatedButton( onPressed: () { selectedValue.value = MyDropdownButtonState()._selectedValue; Navigator.of(context).pushNamed('/second'); }, child: Text('Go to Second Screen'), ), ], ); }, ), ); } }
当您导航到新屏幕时,将选定值保存在ValueNotifier中,并将其作为新屏幕的参数传递;当导航回第一个屏幕时,使用保存在第二个屏幕中的更新selectedValue ValueNotifier。
class SecondScreen extends StatelessWidget { final ValueNotifier<String> selectedValue; SecondScreen({required this.selectedValue}); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('Second Screen'), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text(selectedValue.value), ElevatedButton( onPressed: () { selectedValue.value = MyDropdownButtonState()._selectedValue; Navigator.of(context).pop(); }, child: Text('Go back'), ), ], ), ), ); } }
1条答案
按热度按时间xbp102n01#
要在flutter中导航期间保留
Dropdownbutton
的值,可以将所选值保存在有状态小部件的状态中,并在重建DropDownButton
时使用该值初始化DropDownButton
。在Scaffold中使用
MyDropdownButton
小部件,并用ValueListenableBuilder
Package 它。ValueListenableBuilder
侦听对ValueNotifier
的更改,并在值更改时重新构建DropdownButton
当您导航到新屏幕时,将选定值保存在
ValueNotifier
中,并将其作为新屏幕的参数传递;当导航回第一个屏幕时,使用保存在第二个屏幕中的更新selectedValueValueNotifier
。