Redux - externe Bibliotheken und "Reagieren" in Reducer?

Question

Ich habe einfach Redux Minderer, aber für einige Aktionen Ich brauche Benachrichtigungen anzeigen, um dies zu tun, muss ich meine individuelle Benachrichtigungsfunktion innerhalb des Minderer auslösen so:

case REDUCER_ACTION_NAME: 
    notificationDisplay.success("Message", { 
    additionalStuff: extraOptions 
}); 

Was noch schlimmer Ich verwende react-intl für Übersetzungen und ich brauche die "Message" o sein übersetzen-ready so dies ich hinzufüge, die Mischung:

case REDUCER_ACTION_NAME: 
    notificationDisplay.success(<FormattedMessage id="message" defaultMessage="Message" />, { 
    additionalStuff: extraOptions 
}); 

er eine Übersetzung in Spanne erzeugt und erfordert react so beginnt mein Minderer mit diesen Importen:

import React from 'react'; 
import notificationDisplay from 'my-notifications'; 
import { FormattedMessage } from 'react-intl'; 

import { 
    // all the actions 
} from './actions.jsx'; 

// reducer 

Ist es in Ordnung? Ich fühle etwas hier ist aus - wie importieren React in Reduzierungen ist ein Anti-Muster, weil alle Reduzierer Beispiele, die ich finden konnte, sind so sauber und glatt und es gibt keine externen Bibliotheken dort überhaupt.

Habe ich Recht oder liege ich falsch und mein Code ist völlig in Ordnung?

Answer 1

Sie sollten im Reducer keine Berechnungen durchführen. Es sollte den Zustand ändern und sonst nichts. Die Art, wie Sie es verwenden, ist ein komplettes Anti-Pattern. Weil es einige UI-Aktionen ausführt. Und Redux hat nichts mit der Benutzeroberfläche zu tun. Es sollte als das Geschäft und nur das Geschäft verwendet werden.

Aber Sie können Aktionen verwenden, die viel besser ist, als es in Reducer tun.

Der beste Weg, um Ihr Ziel zu erreichen, besteht darin, Ihren Reducer zu verwenden, um die Nachrichten einfach in ein Array im Redux-Store zu schieben. Und erstellen Sie einen Container, der dieses Nachrichtenarray verwendet, um Erfolgs- oder Fehlermeldungen anzuzeigen. Und erstellen Sie einen Timer, der die Nachricht nach einiger Zeit aus dem Array entfernt.

Schauen Sie sich einfach die https://github.com/diegoddox/react-redux-toastr Repo sie tun es sehr gut.

Dank

Akhil P