2017-02-09 1 views
0

J'ai une application Angular2 qui récupère les données à partir d'une source qui requiert une authentification, de sorte que l'événement init composant application initie le jeton auth chercher comme ceci:Est-ce que ReplaySubject.next (value) viole le principe de l'état immuable de redux store?

import { Component, OnInit } from '@angular/core'; 
import { NgRedux } from '@angular-redux/store'; 
import { rootReducer } from './app.reducer'; 
import * as createLogger from 'redux-logger'; 
import { AppActions } from './app.actions'; 
import { createEpicMiddleware, combineEpics } from 'redux-observable'; 
import { UserEpics } from './users/user.epics'; 
import { ReplaySubject } from 'rxjs/ReplaySubject'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit { 
    constructor(
    private ngRedux: NgRedux<any>, 
    private actions: AppActions, 
    private userEpics: UserEpics, 
) { 
    ngRedux.configureStore(
     rootReducer, 
     { user: { auth: { token$: new ReplaySubject(1) } } }, 
     [ 
     createLogger(), 
     createEpicMiddleware(combineEpics(...userEpics.epics)), 
     ]); 
    } 
    ngOnInit() { 
    this.ngRedux.dispatch(this.actions.getAuthToken()); 
    } 
} 

Redux stocke un Rxjs5 ReplaySubject, et ce sujet sera fed la valeur symbolique du réducteur comme celui-ci:

case AppActions.GET_AUTH_TOKEN_DONE: 
    user.auth.token$.next(action.token); 
    return Object.assign({}, user, { 
    auth: { 
     isFetching: false, 
     token$: user.auth.token$, 
     reason: undefined 
    } 
}); 

ce code fonctionne pour moi, mais il ne viole le principe de l'état immuable du magasin de Redux?

Répondre

2

Je dirais que ce fait - puisque vous pouvez muter l'état où que vous soyez en appelant .next(...) - si elle était un Observable au lieu d'un Subject il pourrait être un peu différent - mais en tout cas, je pense qu'il serait une mauvaise pratique pour stocker Observables dans le cadre de l'état.

+1

En effet, cela est fortement déconseillé. Tout dans votre magasin devrait être sérialisable, même si vous ne le faites jamais en série. Vous n'avez pas à être religieux à ce sujet - si elle contient quelque chose sur un accident qui n'est jamais utilisé - mais en s'appuyant sur elle est une mauvaise forme. Tout cela dit, s'il n'y a pas de voie facile et claire pour la justice, expédiez-la, mais ne vous en faites pas une habitude. Au moins c'est mon opinion. Pour vous fournir une solution plus propre, j'ai besoin de voir pourquoi vous sentez que vous avez besoin du sujet avec. par exemple. votre code épique. Il semble que vous pourriez simplement mettre le jeton dans le magasin tel quel sans sujet? – jayphelps

+0

@jayphelps Merci, je m'en doutais. Je l'ai fait temporairement pour satisfaire un composant qui dépend du jeton d'authentification afin de récupérer les données d'affichage. J'ai recréé ceci à un schéma où la route du composant est gardée par un abonnement au jeton d'authentification du magasin, en utilisant [@ angular-redux/store] (https://github.com/angular-redux/store/blob/master /docs/select-pattern.md) –