Flutter日期选择器选中日期无法显示问题求助

核心问题1：未处理日期选择器取消的场景 #

你在then回调里直接用value!强制解包，如果用户点击取消按钮，value会返回null，此时会触发空指针异常，导致setState代码完全无法执行，日期自然不会更新。

修复代码：

void showDatePickerForUser() {
  showDatePicker(
    context: context,
    initialDate: DateTime.now(),
    firstDate: DateTime.now(),
    lastDate: DateTime.now().add(const Duration(days: 365)),
  ).then((value) {
    if (value != null) { // 先判断非空再执行更新
      setState(() {
        datePicked = value;
      });
    }
  });
}

核心问题2：确认组件是否为StatefulWidget #

setState方法仅能在StatefulWidget的State类中调用，如果你的UI代码写在StatelessWidget里，setState无法触发UI重建，选中的日期不会同步到界面上。

解决：将当前组件改为StatefulWidget，确保datePicked是State类的成员变量，showDatePickerForUser方法和UI代码都在State类内部实现。

额外优化：更可靠的日期格式化 #

直接用substring(0,10)截取日期字符串存在格式兼容风险，推荐使用intl包的DateFormat来格式化：

1. 在pubspec.yaml添加依赖：

dependencies:
  intl: ^0.18.1

2. 导入并替换Text组件的内容：

import 'package:intl/intl.dart';

// 替换原Text的内容
Text(
  DateFormat('yyyy-MM-dd').format(datePicked),
  style: GoogleFonts.ubuntu(
    fontSize: 18,
    color: Colours().unSelectedText,
  ),
)

验证步骤 #

1. 确认当前组件是StatefulWidget
2. 替换showDatePickerForUser方法的代码，处理null情况
3. 运行项目测试，选择日期后查看UI是否更新，取消选择是否会崩溃

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