如何在日期输入字段中显示ISO日期格式- React

Question

用于编辑通过API获取的记录。其中有2个字段是日期字段。来自API的数据格式为:20121-07-30 t20:34:40. 545z;其中，输入字段显示日期-mm-yyyy和日历图标。所有其他文本字段都显示了，但日期没有显示。

我已经尝试了以下

<div className='col text-left'>
<label htmlFor='RegistrationDate' className='text-left'>
Registration Date
</label>
<input
type='date'
name='RegistrationDate'
className='form-control'
value={new Date(RegistrationDate).toLocaleDateString('en-GB')}
onChange={handleChange}
/>
</div>

Answer 1

要将日期转换为yyyy-mm-dd格式(这是输入日期元素接受的唯一格式)，可以使用瑞典语言环境。

registrationDate.toLocaleDateString('sv-SE')

参见:将JavaScript日期格式设置为yyyy-mm-dd

Answer 2

使用'toISOString().substring(0,10)'获取'yyyy-mm-dd'，然后将其传递给value:

const RegistrationDate = new Date("2021-07-30T20:34:40.545Z")
.
.
.
<input
type="date"
name="RegistrationDate"
className="form-control"
value={RegistrationDate.toISOString().substring(0, 10)}
onChange={handleChange}
/>