Quiero redirigir a un usuario a la página "/myblogs" cuando envía una publicación después de editarla. useNavigate gancho se utilizó para redirigir. En lugar de redirigir, aparece el siguiente error. Cuando reviso manualmente la página de mi blog, puedo ver la publicación actualizada. No tengo idea de por qué ocurre este error.
const handleSubmit = e => { e.preventDefault(); console.log(inputs); sendRequest().then(data => console.log(data).then(() => navigate('/myBlogs/')) ); };error en mi consola
BlogDetail.jsx:51 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'then')Aquí está mi código completo
const BlogDetail = () => { const navigate = useNavigate(); const [blog, setBlog] = useState(); const id = useParams().id; console.log(id); const [inputs, setInputs] = useState({}); const { title, descritpion, imageURL } = inputs; const handleChange = e => { setInputs(inputs => ({ ...inputs, [e.target.name]: e.target.value, })); }; const fetchDetails = async () => { const res = await axios .get(`http://localhost:5000/api/blog/${id}`) .catch(err => console.log(err)); const data = res.data; return data; }; useEffect(() => { fetchDetails().then(data => { setBlog(data.blog); setInputs({ title: data.blog.title, descritpion: data.blog.description, imageURL: data.blog.image, }); }); }, [id]); const sendRequest = async () => { const res = await axios .put(`http://localhost:5000/api/blog/update/${id}`, { title: inputs.title, descritpion: inputs.description, }) .catch(err => console.log(err)); const data = await res.data; return data; }; console.log(blog); const handleSubmit = e => { e.preventDefault(); console.log(inputs); sendRequest().then(data => console.log(data).then(() => navigate('/myBlogs/')) ); };console.log es un retorno nulo ( es decir, devuelve undefined ), no devuelve ningún objeto Promise para encadenar. Simplemente emita la navegación imperativa después de la declaración de registro.
const handleSubmit = e => { e.preventDefault(); console.log(inputs); sendRequest() .then(data => console.log(data); navigate('/myBlogs/'); ); };cambié mi código a
sendRequest().then((data) => console.log(data)).then(() => navigate('/myBlogs/'))de esto
sendRequest().then(data => console.log(data).then(() => navigate('/myBlogs/')) );y funciona