如何将DateTimeFormField选中的日期值赋值给变量

你只需要在对应的State类中先定义一个存储日期的变量，然后在onDateSelected回调里给变量赋值即可，如果需要更新UI，记得用setState包裹。

具体步骤： #

1. 在你的State类中声明一个可空的DateTime变量：

DateTime? _selectedDate;

2. 修改onDateSelected回调，把选中的value赋值给这个变量，需要更新UI的话加上setState：

onDateSelected: (DateTime value) {
  setState(() {
    _selectedDate = value;
  });
  // 这里可以直接使用_selectedDate做后续操作，比如打印验证
  print('选中的日期：$_selectedDate');
},

修改后的完整代码示例： #

DateTimeFormField(
  decoration: InputDecoration(
    hintStyle: const TextStyle(color: Colors.black),
    errorStyle: const TextStyle(color: Colors.redAccent),
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(20),
    ),
    hintText: 'MM DD, YYYY',
    filled: true,
    fillColor: Colors.grey[200],
    suffixIcon: const Icon(Icons.event_note),
    labelText: 'Select Date',
  ),
  mode: DateTimeFieldPickerMode.date,
  autovalidateMode: AutovalidateMode.always,
  validator: (e) =>
      (e?.day ?? 0) == 1
          ? 'Please not the first day'
          : null,
  onDateSelected: (DateTime value) {
    setState(() {
      _selectedDate = value;
    });
  },
),

补充说明： #

• 如果你的页面是无状态组件（StatelessWidget），需要先改成有状态组件（StatefulWidget）才能使用setState。
• 要是你用的是Provider、Riverpod这类状态管理库，只需要把赋值逻辑换成对应状态管理的更新方法就行，核心都是在onDateSelected里拿到选中的value并存储。

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