Tengo un problema con Redux y no puedo encontrar dónde va mal. Mi idea: quiero mostrar un mensaje depende de si el usuario ya existe en mi base de datos. Utilicé redux-react pero es realmente confuso para mí. 1 — mi acción

import { SET_MESSAGE_SUBMIT} from "./types"; export const msgRegisterSuccess = () ={amp}gt; { return { type: SET_MESSAGE_SUBMIT }; }; 

2 — Mi reductor

 import {SET_MESSAGE_SUBMIT} from "../actions/types"; export default function (state=false,action){ switch(action.type){ case SET_MESSAGE_SUBMIT: return !state.submitToggle; default: return state; } }; 

3 — Mi contenedor

 import React, { useState} from "react"; import PropTypes from "prop-types"; import { connect } from "react-redux"; import { registerUser } from "../../actions/registerActions"; import Validate from "../../components/form/Validate"; import Contact from "../../components/auth/Contact"; const ContactPage = ({ registerUser}) ={amp}gt; { const [user, setUser] = useState({ user_name: "", email: "", message: "", errors: {} }); const handleChange = e ={amp}gt; { setUser({ ...user, [e.target.name]: e.target.value }); }; const handleBlur = e ={amp}gt; { const { name, value } = e.target; const err = { ...user.errors, ...Validate(name, value).errors }; setUser({ ...user, errors: { ...err } }); }; const handleSubmit = e ={amp}gt; { e.preventDefault(); const { user_name, email, message} = user; registerUser({ user_name, email, message}); }; return ( {amp}lt;div{amp}gt; {amp}lt;Contact user={{ ...user}} onBlur={handleBlur} onChange={handleChange} onSubmit={handleSubmit} /{amp}gt; {amp}lt;/div{amp}gt; ); }; ContactPage.propTypes = { registerUser: PropTypes.func.isRequired, toggle: PropTypes.object.isRequired, errors: PropTypes.object.isRequired }; const mapStateToProps = state ={amp}gt; ({ errors: state.errors, toggle: state.toggle }); export default connect( mapStateToProps, { registerUser } )(ContactPage); 

4 — donde me gustaría enviar mi acción «SET_SUBMIT_MESSAGE» si los datos del usuario se guardan en mi base de datos. Sé que este fragmento de código en particular está mal :(. ¡He intentado taaaaaaaaaaaaa combinación, estoy cansado!

 import axios from "axios"; import {SET_MESSAGE_SUBMIT} from "../actions/successMsgActions"; export const registerUser = (userData) ={amp}gt; dispatch ={amp}gt; { axios .post("/api/users/signup",userData) // .then(dispatch(SET_MESSAGE_SUBMIT)) .catch(err ={amp}gt; { dispatch(setErrors(err.response.data)); // dispatch(SET_MESSAGE_SUBMIT); }); }; 

¿Alguien puede ayudarme?

Nad ‘

Ngaya

es un nuevo contribuyente a este sitio. Tenga cuidado al pedir aclaraciones, comentarios y respuestas. Mira nuestro

Código de Conducta

.

Veo alguna inconsistencia en el estado

Aquí es booleano

export default function (state=false,action){

aquí vuelves estado o boolean

  switch(action.type){ case SET_MESSAGE_SUBMIT: return !state.submitToggle; default: return state; } 

pero en componente esperas objeto

 const mapStateToProps = state ={amp}gt; ({ errors: state.errors, toggle: state.toggle }); 

No probé todo el código solo, pero otros piensan que parecen estar bien.