Estoy trabajando en nextjs, estoy integrando "boletín informativo", cada vez que mi respuesta es verdadera, el mensaje de validación se muestra correcto (si es una condición), pero solo se muestra una vez durante 5 segundos, y cada vez que recibo un error, aparece un mensaje de validación (de lo contrario, la condición) no funciona, significa que no se muestra el mensaje de "error" Aquí está mi código
import React, { useEffect, useState } from "react"; import FlashMessage from 'react-flash-message'; import { render } from 'react-dom'; const Subscribe = () => { const [email, setEmail] = useState(''); const [error, setError] = useState(''); const [success, setSuccess] = useState(''); const subscribeMe = async (event) => { const emails = email; event.preventDefault(); const res = await fetch('https://example.com/admin-panel/Api/subscribe?email='+emails); const data = await res.json(); const status = data["status"]; const message = data["msg"]; if (status === "false") { setError(error); } else { setSuccess(message); } }; const changeEmail = (event) => { const email = event.target.value; setEmail(email); }Y probé con el siguiente código para mostrar el mensaje de "éxito" o "error"
{success && ( <FlashMessage duration={5000}> <div class="alert alert-success"> <strong>{success}</strong> </div> </FlashMessage> )} {error && ( <FlashMessage duration={5000}> <div class="alert alert-danger"> <strong>{error}</strong> </div> </FlashMessage> )}Dado que la respuesta de la API es {"status":false,"msg":"Email already exist"} , data['status'] debe compararse con el valor booleano.
=== comprueba tanto el valor como el tipo ( referencia de MDN aquí ). En este caso, siempre devuelve falso porque está comparando una cadena con un valor booleano.
Si cambia la comparación a if( status === false ) , entonces debería funcionar