Javascript React JS-onChange函数被触发两次

我在react中处理日期输入时遇到问题。因此，日期值来自graphQL，日期格式为

dd.mm.yyyy

，但为了为HTML日期输入设置默认值，我正在将格式转换为

yyyy.mm.dd

，为了再次保存数据，我需要反之亦然

我正在状态中保存日期，并调用change函数来更新值和转换格式

问题是此函数在更改时被触发两次，并返回

nannan

（在第二次运行时），但不是每次都会触发（奇怪）。而且，对于某些日期，它可以正常工作，例如，在

02.03.2000

无错误且只执行一次的情况下

使用24时，它两次调用，第二次调用时出错（参见屏幕截图）。也许转换是错误的？如果我从输入中删除

defaultValue

，那么它只调用一次

状态={
新用户：{
GEBURTSDATA:“01.02.2000”
}
}
ConvertDate（htmlDate，格式）{
var日期=新日期（htmlDate）；
var dd=date.getDate（）；
var mm=date.getMonth（）+1；
var yyyy=date.getFullYear（）；
如果（dd<10）{
dd=“0”+dd；
}
如果（毫米<10）{
mm=“0”+mm；
}
如果（格式==“graphql”）日期=dd+“+mm+”+yyyy；
如果（格式==“html”）日期=yyyy+“-”+dd+“-”+mm；
返回日期；
}
onChange=e=>{
设值=e.target.value；
让name=e.target.name；
如果（例如，target.type==“日期”）{
value=this.convertDate（值“graphql”）；
console.log（值、名称）；
}
this.setState（prevState=>{
返回{
新用户：{
…prevState.newUser，
[名称]：值
}
};
});
};

函数被调用两次，因为在渲染方法中调用了两次

第一次调用：对输入：onChange（）调用ConvertDate（）方法并设置状态。关于设置状态组件重新渲染

第二次调用：组件重新呈现，并在获取defaultValue时调用ConvertDate（）方法

我建议将defaultValue存储在state中，并从state中检索该值，而不是在render方法中调用函数

您收到NaN，因为传递给函数“ConvertDate”的日期无效。原因可能是您从API收到的日期在某种程度上不正确。尝试使用它进行日期处理和转换，它相对简单，可以避免错误

编辑：
Javascript Date（）构造函数接受这两种格式“yyyy-mm-dd”或“mm-dd-yyyy”

console.log（新日期（“2019-12-14”）；//有效的yyyy-mm-dd
控制台日志（新日期（“2019-14-12”）；//无效的yyyy-dd-mm
控制台日志（新日期（“2019年12月14日”）；//有效日期：年月日
控制台日志（新日期（“2019年12月14日”）；//无效的dd-mm-yyyy

什么是转换日期？功能部件？没有

return

method返回给定格式的日期。那么

render

函数在哪里？这是什么

为什么您的输入没有传递值属性？defaultValue道具仅用于初始渲染。使用“value”属性而不是“defaultValue”，查看您的问题是否已解决。onChange函数被调用两次，如果我从输入中删除defaultValue，则不会。我认为在设置defaultValue时，它也会触发onChange事件。但是为什么某些日期的问题不是全部L。javascript date（）构造函数所期望的日期格式是mm.dd.yyyy或yyyy.mm.dd。问题在于前两个字符的值大于“12”的日期，因为只能有12个月。