时间戳

首页 > 解决方案 > 在 React 中通过提交 Formik 表单通过 wp_mail() 发送电子邮件

php - 在 React 中通过提交 Formik 表单通过 wp_mail() 发送电子邮件

问题描述

因此，正如上面的标题所述，我想知道如何实现这一目标。有没有办法将提交的 Formik 值传递给 WPMAIL 文件，并使用这些接收到的道具将其发送到wp_mail()函数。以此类推，将道具以电子邮件的形式发送到指定的电子邮件地址。我几乎找不到我的案子的答案，而且从我的发现来看，它并没有真正帮助我。

有人说您必须注册其余路线，在我的情况下是 /contact，但这对我没有帮助。

目前我必须在我的 ContactScreen.js 中关注：

<div className="w-full">
 <div className="mx-4 rounded-lg">
  <Formik
    initialValues={{ name: '', email: '', phone: '', message: '',}}
    validationSchema={SignupSchema}
    onSubmit={(values, {resetForm}) => {
      this.setState({values: values})
      alert(JSON.stringify(this.state.values, null, 2));
      resetForm({ values: '' })
    }}
    >
    {({ errors, touched }) => (
      <FormikForm className="bg-lightorange rounded pt-8 pb-16 px-20 mb-4 " method="POST">
        <div className="flex flex-wrap -mx-3 mb-2">
          <div className="w-full md:w-1/2 px-3">
            <div className={`${errors.name && touched.name ? 'display-block invalid-message' : 'display-none'} rounded h-8 mb-2 text-xs ease-in-out duration-300`}><ErrorMessage name="name"/></div>
            <FormikField placeholder="Naam" type="text" name="name" className={`appearance-none block w-full active:bg-white-100 rounded my-2 py-3 px-8 leading-10 focus:outline-none focus:bg-white ${errors.name && touched.name ? 'invalid' : null}`} />
          </div>
          <div className="w-full md:w-1/2 px-3">
            <div className={`${errors.email && touched.email ? 'display-block invalid-message' : 'display-none'} rounded h-8 mb-2 text-xs ease-in-out duration-300`}><ErrorMessage name="email"/></div>
            <FormikField placeholder="E-mailadres" type="email" name="email" className={`appearance-none block w-full active:bg-white-100 rounded my-2 py-3 px-8 leading-10 focus:outline-none focus:bg-white ${errors.email && touched.email ? 'invalid' : null}`} />
          </div>
        </div>
        <div className="flex flex-wrap -mx-3 px-3 my-2">
          <div className="w-full">
            <div className={`${errors.phone && touched.phone ? 'display-block invalid-message' : 'display-none'} rounded h-8 mb-2 text-xs ease-in-out duration-300`}><ErrorMessage name="phone"/></div>
            <FormikField placeholder="Telefoonnummer" type="text" name="phone" maxLength="12" className={`appearance-none block w-full active:bg-white-100 rounded my-2 py-3 px-8 leading-10 focus:outline-none focus:bg-white ${errors.phone && touched.phone ? 'invalid' : null}`}/>
          </div>
        </div>
        <div className="flex flex-wrap -mx-3 px-3 my-2">
          <div className="w-full">
            <div className={`${errors.message && touched.message ? 'display-block invalid-message' : 'display-none'} rounded h-8 mb-2 text-xs ease-in-out duration-300`}><ErrorMessage name="message"/></div>
            <FormikField placeholder="Bericht" as="textarea" name="message" rows={4} className={`appearance-none block w-full resize-none active:bg-white-100 rounded my-2 py-3 px-8 leading-10 focus:outline-none focus:bg-white ${errors.message && touched.message ? 'invalid' : null}`}/>
          </div>
        </div>
        <div className="flex items-center justify-between">
          <Button type="submit">Bericht versturen</Button>
        </div>
      </FormikForm>
    )}
  </Formik>
</div>

这是在我的 ContactMailApi.php 中（与src文件夹处于同一级别：

<?php

header("Access-Control-Allow-Origin: *");
$rest_json = file_get_contents("php://input");
$_POST = json_decode($rest_json, true);

if (empty($_POST['name']) && empty($_POST['email'])) die();

if ($_POST) {
 http_response_code(200);
 $to = "example@gmail.com";
 $subject = $_POST['name'];
 $from = $_POST['email'];

 $msg = $_POST['number'] . $_POST['message'];

 $headers = "MIME-Version: 1.0\r\n";
 $headers.= "Content-type: text/html; charset=UTF-8\r\n";
 $headers.= "From: <" . $from . ">";
 wp_mail($to, $subject, $msg, $headers);


 echojson_encode(array(
  "sent" => true
 ));
}
else {
 echojson_encode(["sent" => false, "message" => "Something went wrong"]);
}

我怎么能做到这一点？还是我完全忽略了一些相当容易的事情？如果需要更详细的信息，请在下面告诉我

标签： phpreactjswordpressformik

解决方案

现在不用管这个了。我只是将 axios 发布到一个新注册的 rest_api 路由。并从那里获取带有响应的网址......

推荐阅读