如何将当前日期设置为下述代码中input标签的min日期？

要把日期输入框的min值从固定日期改成当前日期，你需要先把当前日期格式化为YYYY-MM-DD（HTML5日期输入框要求的标准格式），再动态绑定到min属性上。

步骤1：编写日期格式化函数 #

先写一个函数生成符合格式要求的当前日期字符串：

const getCurrentDate = () => {
  const today = new Date();
  const year = today.getFullYear();
  // 月份从0开始计数，需加1，并用padStart补前导零保证两位数格式
  const month = String(today.getMonth() + 1).padStart(2, '0');
  const day = String(today.getDate()).padStart(2, '0');
  return `${year}-${month}-${day}`;
};

步骤2：修改输入框代码 #

把固定的min="2022-10-14"替换为动态调用函数的结果：

<input
  type="date"
  className="form-control"
  placeholder="Pick a date"
  name="closingDate" 
  min={getCurrentDate()}                      
  onChange={(e) => setClosingDate(e.target.value)}
/>

这样页面加载时，输入框的最小日期会自动设为当天，用户无法选择早于当前日期的选项。

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