当我使用react.js传递到mysqldb时,我遇到了更改日期格式的问题



大家好,我使用moment(donors.donateDate).format('DD-MM-YYYY')将输入的日期设置为dd/mm/yyy格式但当点击提交按钮时,它会在控制台中显示这个错误。The specified value "23-03-2022" does not conform to the required format, "yyyy-MM-dd".

这是我的代码:-

import { TextField } from '@material-ui/core';
import moment from 'moment';
export default function DonorForm ({showForm})  {
const [donors, setDonors] = useState({
donateDate: ""
});
let name, value;
const handleInputs = (e) => {
console.log(e);
name = e.target.name;
value = e.target.value;

setDonors({...donors, [name]: value });
};
// For changing date format in TextFeild.
const newDate1 = moment(donors.donateDate).format('DD-MM-YYYY')
console.log(newDate1)
const onclick = async (e) => {
const {donateDate } =
donors;
const config = {
header: {
"Content type": "appication/json",
},
};
setLoading(true);
const { data } = await axios.post(
"http://localhost:4000/donorsform",
{  
donateDate
},
config
);
console.log(data);
localStorage.setItem("donorsInfo", JSON.stringify(data));
navigate("/coordinators/myprojects");
};
return(
<>
<div className="card-header ">
<h3 className="card-title my-1">Donor Details</h3>
</div>
<form 
onSubmit={handleSubmit(onclick)}
method="POST"
className="form-horizontal "
id="register-form"
>
<div className="card-body">     
<div className="row">
<div className="form-group">
<label className="form-label col">Date</label>
<div>
<TextField
onChange={handleInputs}
id="donateDate"
type="date"
className="form-control col-12 mx-1"
name="donateDate"
value={newDate1}
/>

</div>
</div> 
</div>
</div>
<div className="card-footer">
<button type="submit" className="btn-hover-1 color-3">
Submit
</button>
</div>
</form>
</>
);
};

最后,我还想做的是,如果用户访问此表单,"donateDate"字段默认显示当前日期

您的后端预期日期,格式为YYYY-MM-DD
因此您可以这样做,如下所示

const newDate1 = moment(donors.donateDate).format('YYYY-MM-DD')

最新更新