Tajuk ditulis semula sebagai: React bersepadu DateTimePicker dengan react-hook-form tidak boleh memaparkan tarikh dengan betul-Soal Jawab Rangkaian PHP Cina

Artikel Topik pembelajaran Muat turun Soal Jawab Kamus Pengaturcaraan Permainan kemas kini terkini

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

Tajuk ditulis semula sebagai: React bersepadu DateTimePicker dengan react-hook-form tidak boleh memaparkan tarikh dengan betul

P粉418854048 2023-09-12 17:36:32

492

Saya mempunyai borang yang saya cuba tambahkan pemilih tarikh React, tetapi saya juga cuba menyepadukannya denganreact-hook-formsupaya ia berfungsi dengan borang yang lain, tetapi ia nampaknya tidak berfungsi sama sekali .

Apabila borang mula-mula dipaparkan, tarikh semasa tidak dipaparkan dalam pemilih tarikh, hanya "----------" dipaparkan dan apabila saya memilih tarikh daripada pop timbul, tarikh dalam medan akan dipaparkan. tak berubah pun.

import { Controller, useForm } from 'react-hook-form' import DateTimePicker from 'react-datetime-picker' import 'react-datetime-picker/dist/DateTimePicker.css' import 'react-calendar/dist/Calendar.css' const Jobs = () => { const { control, register, handleSubmit, watch, formState: { errors } } = useForm(); const onSubmit = handleSubmit(async ({ firstname, startdate }) => { console.log(startdate) }) return (    
   (  )} /> 
 
 ) }

P粉418854048

membalas semua (1)

P粉4389183232023-09-13 15:56:29 Tingkat 1

Nampaknya anda betul dalam menggunakan react-hook-form dan react-datetime-picker. Masalah yang anda hadapi mungkin berkaitan dengan nilai awal medan tarikh yang ditetapkan dengan tidak betul.

Untuk menyelesaikan masalah ini, anda bolehmenetapkan nilai awaluntuk medan tarikh menggunakan sifat defaultValue dalam Pengawal. Selain itu, anda harus memastikan bahawa nilai yang dihantar kepada DateTimePicker ialah objek Date, kerana react-datetime-picker menjangkakan nilai Date.

Berikut ialah kod yang dikemas kini:

import { Controller, useForm } from 'react-hook-form'; import DateTimePicker from 'react-datetime-picker'; import 'react-datetime-picker/dist/DateTimePicker.css'; import 'react-calendar/dist/Calendar.css'; const Jobs = () => { const { control, register, handleSubmit, formState: { errors }, } = useForm(); const onSubmit = handleSubmit(async ({ firstname, startdate }) => { console.log(startdate); }); return (    
   (  )} /> 
 
 ); };

Dengan menetapkandefaultValuekepadanew Date(), pemilih tarikh kini harus memaparkan tarikh semasa apabila borang mula-mula dipaparkan. Juga, pastikan bahawa apabila menghantar nilai kepada DateTimePicker menggunakan Date(value) baharu ia adalah objek Date.