How to change date format in react?

Question

I am unable to change the date format for which I am not able to show the date in frontend.

I am using dateformat package.

import dateFormat from "dateformat";
const EditFinancialInfo = ({ info }) => {
  const [moneyToBePaid, setMoneyToBePaid] = useState({
    dueDate: dateFormat(info.moneyToBePaid.dueDate, "dd-MM-yyyy"),
  })

  return (
    <div>
      <input label="Due" type="date"
        name="dueDate"
        onChange={mtpHandleChange}
        value={moneyToBePaid.dueDate}
      />
    </div>
  )
}

I am getting this error

The specified value "15-30-2020" does not conform to the required format, "yyyy-MM-dd"

Answer 1

Default format for input type="date" is YYYY-MM-DD and it is impossible to change.

You need to re-format your date value to match with input date format

dueDate: dateFormat(info.moneyToBePaid.dueDate, "yyyy-MM-dd")

Answer 2

这里的问题是你日期的月份，月份必须是从 1 到 12，这意味着一月到十二月，但你的月份是 30，这就是出现这个错误的原因