Flutter中点击按钮重置Dropdown Menu至默认值的实现方法

以下是修复后的完整代码，可实现点击按钮将下拉菜单重置为默认状态：

class DrawerScreen extends StatefulWidget {
  const DrawerScreen({super.key});

  @override
  State<DrawerScreen> createState() => _DrawerScreenState();
}

class _DrawerScreenState extends State<DrawerScreen> {
  final List<String> list = <String>['One', 'Two', 'Three', 'Four'];
  String? dropdownValue;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          DropdownButton<String>(
            hint: const Text('Select an option'),
            value: dropdownValue,
            icon: const Icon(Icons.arrow_downward),
            elevation: 16,
            style: const TextStyle(color: Colors.deepPurple),
            underline: Container(
              height: 2,
              color: Colors.deepPurpleAccent,
            ),
            onChanged: (String? value) {
              setState(() {
                dropdownValue = value;
              });
            },
            items: list.map<DropdownMenuItem<String>>((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Text(value),
              );
            }).toList(),
          ),
          ElevatedButton(
            onPressed: () {
              setState(() {
                dropdownValue = null;
              });
            },
            child: const Text("Reset"),
          )
        ],
      ),
    );
  }
}

关键修复点说明： #

• 替换无状态组件为有状态组件：原代码用StatelessWidget却调用状态更新方法，改为StatefulWidget并创建对应State类，实现状态管理。
• 迁移状态变量位置：把dropdownValue和选项列表list移到State类中，避免每次build执行时重新初始化，确保状态可以持续维护。
• 修正setState拼写与语法：原代码setstate是小写错误，正确写法为setState，且需传入匿名函数() { ... }包裹状态更新逻辑。
• 修复按钮参数与文本：按钮点击回调参数修正为onPressed，文本从"reste"改为"Reset"。
• 优化重置逻辑：将dropdownValue设为null，让下拉菜单回到显示hint的默认状态，避免空字符串引发的异常。
• 修正代码结构：补全组件数组的逗号、闭合括号，保证Widget树结构合法。

内容的提问来源于stack exchange，提问作者mohammed aref saeed alsrkal