Company logo
  • Empleos
  • Bootcamp
  • Acerca de nosotros
  • Para profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
    • Bootcamp
  • Para empresas
    • Inicio
    • Nuestro proceso
    • Planes
    • Pruebas
    • Nómina
    • Blog
    • Comercial
    • Calculadora

0

56
Vistas
How to make a message appear once email is submitted using React and CSS

I am using React and have built an email form. I currently have this class: <div className="msg">Message has been sent</div> but only want it to appear when the message has successfully sent. So only when the following resolves as status: true. How can I target this using only React/CSS?

  .post('/api/email', values)
  .then((res) => {
    console.log("Server responded")
    setValues({
      name: "",
      email: "",
      message: "",
      status: true
    })
    .catch(err => {
      console.log(err);
      window.alert("Email not sent")
    });```


7 months ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

if your status varible named status then

<div className="msg" style={{display: status ? "block" : "none"}}>Message has been sent</div>

That's it.

And I suggest that you should add following code.

.catch(err => {
setValues({
  name: "",
  email: "",
  message: "",
  status: false
  })
  console.log(err);
  window.alert("Email not sent")
});```
7 months ago · Juan Pablo Isaza Denunciar

0

Wrapping the div between curly brackets, and add a condition && should do the work:

{values.status && <div className="msg">Message has been sent</div>}
7 months ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos