MUI DatePicker tidak serasi dengan Formik: date.isBefore tidak tersedia
P粉046387133
2023-08-25 08:54:13
<p>Saya menggunakan Formik untuk mencipta borang dalam React dan juga menggunakan komponen MUI.Masalahnya ialah saya mendapat ralat berikut: </p>
<pre class="brush:php;toolbar:false;">date.isBefore bukan fungsi
TypeError: date.isBefore bukan fungsi
di DayjsUtils.isBeforeDay (http://localhost:3000/static/js/bundle.js:2319:19)
pada validateDate (http://localhost:3000/main.aa62b4b6c891ec5ff2b0.hot-update.js:10596:43)
di useValidation (http://localhost:3000/main.aa62b4b6c891ec5ff2b0.hot-update.js:10654:27)
di usePickerValue (http://localhost:3000/main.aa62b4b6c891ec5ff2b0.hot-update.js:10019:75)
di usePicker (http://localhost:3000/main.aa62b4b6c891ec5ff2b0.hot-update.js:9876:94)
di useDesktopPicker (http://localhost:3000/main.aa62b4b6c891ec5ff2b0.hot-update.js:7848:60)
di DesktopDatePicker (http://localhost:3000/main.aa62b4b6c891ec5ff2b0.hot-update.js:3956:90)
di renderWithHooks (http://localhost:3000/static/js/bundle.js:103306:22)
di updateForwardRef (http://localhost:3000/static/js/bundle.js:105877:24)
di beginWork (http://localhost:3000/static/js/bundle.js:107924:20)</pre>
<p>Ini kod saya: </p>
<pre class="brush:php;toolbar:false;"><Formik
onSubmit={handleFormSubmit}
initialValues={initialValuesProject}
validationSchema={projectSchema}
>
{({ values, handleChange, handleSubmit, setFieldValue }) =>
<borang onSubmit={handleSubmit}>
<Lebar kotak="50%">
<LocalizationProvider dateAdapter={AdapterDayjs}>
<Pemilih Tarikh
id="project_start"
name="project_start"
value={values.project_start}
slotProps={{
medan teks: {
saiz: "kecil",
jidar: "padat",
},
}}
/>
<Pemilih Tarikh
id="project_end"
name="projek_tamat"
value={values.project_end}
slotProps={{
textField: { saiz: "kecil", jidar: "padat"
}}
/>
</Penyedia Penyetempatan>
</Kotak>
</form>
)}</Formik></pre>
<p>Ini ialah mod dan nilai awal: </p>
<pre class="brush:php;toolbar:false;">const projectSchema = yup.object().shape({
project_start: yup.date(),
project_end: yup.date(),
nama_projek: yup.string().diperlukan("diperlukan"),
usersId: yup.string(),
partnerId: yup.string(),
categoryId: yup.string(),
});
const initialValuesProject = {
project_start: Date.now(),
project_end: Date.now(),
nama_projek: "",
UserId: "",
partnerId: "",
categoryId: "",
};</pre>
<p>Ribuan terima kasih kepada sesiapa yang boleh membantu saya <3</p>
<p>Dapat membuat pemilih tarikh berfungsi</p>
Nampaknya masalahnya di sini:
Jenis projek_mula dan projek_akhir hendaklah Dayjs: