action; réducteur: combine réducteur: Store: et code: essentiellement mon message initial apparaît normalement dans mon corps de chat
Mais lorsque je saisie un message et utilisez l'expédition, j'obtiens les erreurs suivantes: Erreur non capturée: les objets ne sont pas valides comme un enfant de réaction (trouvé: objet
avec des clés {texte}).
et L'erreur ci-dessus s'est produite dans le composant:
Le problème est ici:
4 Réponses :
Peut-être que vous pouvez modifier votre const initalstate = {texte: []};
retour [... état, texte: [... action.payload]];
J'essaie ceci mais a eu une erreur: une erreur d'analyse: jeton inattendu
Très probablement c'est un problème avec le réducteur lorsque vous mettez à jour l'état..plusez la valeur de l'état et de l'action.payload.text.also, essayez d'utiliser l'état initial en tant qu'objet à la place d'un tableau afin d'accéder à des clés afin d'accéder aux clés de manière à ce que l'accès à des clés. en facile. Dans vos clés de cas dans l'état pourraient être envoyeur et texte.
var initialstate = {texte: ["msg1"]};
action.payload = {texte: "msg2", expéditeur: "utilisateur"}; Assurez-vous que l'action que la charge utile.text est comme la valeur supérieure.
et enfin, les fusionner comme mentionné ci-dessous. Cela ajoutera de nouveaux msg à la gamme de textes au lieu de remplacer le MSG à chaque fois.
var newstate = {"Texte": objet.Assign ({}, stat.text, action.payload)};
Vous devrez également mettre à jour le tableau.MAP dans votre JSX.
Mais dans ma charge utile, j'ai un attribut où j'indique s'il s'agit d'un msg Bot ou d'utilisateur.
J'ai du texte et de l'expéditeur.
Je n'ai pas compris comment je vais appliquer le nouvel État pourriez-vous m'aider avec cela?
Bien sûr ... Je suppose que vous devez capturer l'utilisateur pour chaque msg. Donc, mettez à jour votre structure de données comme suit: Var InitialState = {journaux: [{Texte: "msg1", expéditeur: "user1"}]}; varecte.payload = {texte: " msg2 ", expéditeur:" user2 "} ** ** var newstate = {" "Journaux": [... État.logs, action]}; Mettez des journaux de console et voir l'action. La charge utile et l'état initial devraient avoir la même structure que ci-dessus
Code de mise à jour: Var InitialState = {LOGS: [{Texte: "MSG1", Sender: "User1"}]}; action.payload = {texte: "msg2", expéditeur: "user2"} var newstate = {"" Journaux ": [... State.logs, action.payload]}
@gabriel avez-vous essuyé cela ??
Et mettre à jour jsx comme suit:
Vous essayez de faire une matrice en tant que réactant enfant (Message.text est une matrice): Essayez ceci: p> <Styled.ChatLog>
{messages.map(message => (
<Styled.ChatMessage>{message.text.join()}</Styled.ChatMessage>
))}
Le problème est que votre action s'attend à des paramètres individuels, mais vous passez un seul objet
dispatch(sendMessage(text))
Oups pourriez-vous m'aider avec une dernière chose? Je suis un peu confus quant à la manière dont je pourrais envoyer un message défini qui était un utilisateur qui l'a envoyé par rapport au réducteur, je devra probablement faire un logiciel moyen de retour s'il s'agit d'un bot ou non de la valeur
Dans votre réducteur, pouvez-vous aussi diffuser l'action.payload aussi et voir si cela aide?
[... Etat, ... action.payload]Est-ce: {Texte: Array (1)} 1: {Texte: {...}, expéditeur: "utilisateur"}?
Je pense que le problème est avec votre cas de réducteur
on_message , je pense quelque chose avec la façon dont vous ajoutez leaction.payload n'est pas correct, c'est pourquoi je l'ai suggéré. Cela vous aide-t-il ou vous obtenez toujours la même erreur?ouais maintenant j'ai eu ceci: action.payload n'est pas démarré
Mais pourquoi mon problème serait-il ma charge utile? Je peux voir le message initial dans mon chat, je ne peux tout simplement pas voir lors de la rendu de nouveaux composants de message
Parce que si cela fonctionne d'abord d'abord, puis rompt dès que vous mettez à jour l'état via une expédition. Réagir est de se plaindre que vous transmettez un objet au lieu d'un seul texte, votre carte ne retourne pas ce que vous pensez que cela revient. Pouvez-vous consoler.log ce que vous essayez de mapper après avoir tapé le message? (Au moins c'est ma compréhension, bien sûr que je me trompe)
Et que me recommanderiez-vous de résoudre ce problème?
Pouvez-vous faire la console.log de messages juste après la carte? comme
{messages.map ((message) => {console.log (message); renvoyer ..........})}