[如何从对象数组中提取数据以在html电子邮件模板中呈现列表？使用React / Formik / Sendgrid

Question

所以，基本上我有一个表单数据，我无法正确解析。我不断在listPets变量的响应中获取[object Object]。其他所有变量都正确映射。有人对我该如何处理有任何想法吗？ ：）

        <Formik
            initialValues={{
              email: '',
              password: '',
              jobType: '',
              comments: '',
              cookies: [],
              terms: '',
              newsletter: '',
              firstName: '',
              pets: [{ type: '', name: '', id: '1' }]
            }}
            validationSchema={LoginSchema}
            onSubmit={async data => {
              await sleep(1000);
              setStatus(prevStatus => ({ ...prevStatus }));
              const res = await fetch('/api/send', {
                method: 'POST',
                headers: {
                  'Content-Type': 'application/json'
                },
                body: JSON.stringify(data)
              });
              const text = await res.text();
              handleResponse(res.status, text);
            }}
          >

const sgMail = require('@sendgrid/mail');

export default async function(req, res) {
  sgMail.setApiKey(process.env.SENDGRID_API_KEY);

  const { email, comments, firstName, cookies, jobType, pets } = req.body;

  const listPets = pets.map(pet => <li key={pet.id}>{pet.name}</li>);

  const content = {
    to: '',
    from: email,
    subject: `New Message From - ${email}`,
    text: comments,
    html: `
    <p>Hi, ${firstName}.</p>
    <p>${comments}</p>
    <p>${cookies}</p>
    <p>${jobType}</p>
    <p>${listPets}</p> 
    `
  };

  try {
    console.log('Content', content);
    res.status(200).send('Message sent successfully.');
  } catch (error) {
    console.log('ERROR', error);
    res.status(400).send('Message not sent.');
  }
}

Answer 1

为什么不使用JSON.stringify（pets）调试正在发生的事情？我会发表评论，但我没有足够的声誉。