[英]react datepicker with emailjs
我做了预订表格。 我想使用日期选择器通过 email 发送预订时间。 所以我使用emailjs收到了预订信息,但时间不同。 我检查了控制台,没有问题,但是当我检查email时,又发送了一次。 这有什么问题?
import { React, useRef } from "react";
import { useForm, Controller } from "react-hook-form";
import emailjs from "@emailjs/browser";
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
const Contact = () => {
const form = useRef();
const time = useRef();
const { control } = useForm();
const sendEmail = (e) => {
const info = {
name: form.current["name"].value,
email: form.current["email"].value,
phone: form.current["phone"].value,
message: form.current["message"].value,
size: form.current["size"].value,
time: time.current.props.selected,
};
console.log("log name", form.current["name"].value);
console.log("log email", form.current["email"].value);
console.log("log phone", form.current["phone"].value);
console.log("log message", form.current["message"].value);
console.log("log size", form.current["size"].value);
console.log("log time", time.current.props.selected);
e.preventDefault();
emailjs
.send("serviceID", "templateID", info, "publicKey")
.then(
(result) => {
console.log(result.status, result.text);
},
(error) => {
console.log(error.status, error.text);
}
);
};
return (
<section class="page-section" id="contact">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Reservation</h2>
</div>
<form id="contactForm" ref={form} onSubmit={sendEmail}>
<div class="row align-items-stretch mb-5">
<div class="col-md-6">
<div class="form-group">
<Controller
control={control}
name="time"
id="time"
render={({ field }) => (
<DatePicker
placeholderText="Select date"
onChange={(date) => field.onChange(date)}
selected={field.value}
showTimeSelect
dateFormat="Pp"
timeFormat="p"
//minDate={new Date()}
minDate={new Date()}
minTime={new Date().setHours(17, 0, 0, 0)}
maxTime={new Date().setHours(21, 0, 0, 0)}
ref={time}
/>
)}
/>
</div>
控制台日志
JavaScript 通常将本地时区转换为 UTC。 我认为这是在 api 中发送 UTC 时间的问题。你可以使用 momentjs 或者我已经分享了讨论,对于这个问题有很多解决方案。
参考这个..
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.