如何禁用Flutter中DropdownMenu<T>组件的文本编辑功能？

要让DropdownMenu处于只读状态，禁止用户手动输入文本，你可以通过以下两种方式实现：

方法一：关闭搜索并设置输入框只读 #

通过enableSearch关闭搜索功能，同时在textFieldProps中配置内部输入框为只读，这样既禁止文本输入，又保留下拉展开的交互：

DropdownMenu(
  width: maxWidth,
  initialSelection: state.current,
  enableSearch: false, // 关闭搜索输入功能
  textFieldProps: const TextFieldProps(
    readOnly: true, // 设置输入框为只读状态
  ),
  dropdownMenuEntries: options.map(
    (e) {
      return DropdownMenuEntry(
        value: e,
        label: e.name ?? "",
        labelWidget: SizedBox(
          width: size.width,
          child: Text(
            e.name ?? "",
          ),
        ),
      );
    },
  ).toList(), // 注意补充toList()，否则map结果无法直接作为列表传入
)

方法二：完全禁用输入框交互 #

如果希望连输入框的聚焦、点击都禁止，可以直接设置输入框为禁用状态，不过组件会呈现灰化的禁用样式：

DropdownMenu(
  width: maxWidth,
  initialSelection: state.current,
  textFieldProps: const TextFieldProps(
    enabled: false, // 完全禁用输入框的所有交互
  ),
  dropdownMenuEntries: options.map(
    (e) {
      return DropdownMenuEntry(
        value: e,
        label: e.name ?? "",
        labelWidget: SizedBox(
          width: size.width,
          child: Text(
            e.name ?? "",
          ),
        ),
      );
    },
  ).toList(),
)

注意事项 #

• 若不需要搜索功能，优先选择方法一，既能禁止文本编辑，又能保持组件正常的点击展开体验。
• 原代码中options.map的返回值需要调用toList()转换为列表，否则会导致参数类型不匹配的错误。

内容的提问来源于stack exchange，提问作者Kdon