Réimplement redux observable avec seulement RxJs?

J'essaie de voir (par curiosité) à quel point il serait complexe de réimplémenter le comportement de base redux/redux-observable avec des Rxjs purs.Réimplement redux observable avec seulement RxJs?

Voici mon point de vue, mais il semble incroyablement simple d'avoir raison. Quelqu'un peut-il me signaler des erreurs/défauts dans ma logique?

Merci beaucoup

// set up the store.dispatch functionnaly through a subject (action$.next() is like store.dispatch()) 
 
var action$ = new Rx.Subject() 
 

 

 
// Create epics that do nothing interesting 
 
function epic1(action$) { 
 
    return action$.filter(action => action.type == "test").delay(1000).mapTo({ 
 
    type: "PONG" 
 
    }) 
 
} 
 

 
function epic2(action$) { 
 
    return action$.filter(action => action.type == "test2").delay(2000).mapTo({ 
 
    type: "PING" 
 
    }) 
 
} 
 

 

 
//.... 
 
//Later on, Merge all epic into one observable 
 
// 
 
function activateAndMergeEpics(action$, ...epics) { 
 
    // give the action$ stream to each epic 
 
    var activatedArray = epics.map(epic => epic(action$)) 
 
    // merge them all into one megaObservable 
 
    var merged = Rx.Observable.merge(...activatedArray) 
 
    return merged 
 
} 
 

 

 
var merged = activateAndMergeEpics(action$, epic1, epic2) 
 

 
// Pipe your megaObservable back inside the loop so 
 
// you can process the action in your reducers 
 
var subscription = merged.subscribe(action$) 
 

 
function rootReducer(state = {}, action) { 
 
    console.log(action) 
 
    return (state) 
 
} 
 

 
// Generate your state from your actions 
 
var state$ = action$.scan(rootReducer, {}) 
 

 
// Do whatever your want now, like... 
 
// state$.map(route).map(renderdom) 
 

 
// Let's juste subscribe to nothing to get the stream pumping 
 
state$.subscribe() 
 

 

 

 
// Simulate a dispatch 
 
action$.next({ 
 
    type: "test" 
 
}) 
 

 
// Another one 
 
action$.next({type:"test2"})

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.4.3/Rx.min.js"></script>

Source

2017-10-05 TheoH

Eh oui, vous avez totalement obtenu la fonctionnalité de base.

J'espère que cela ne vous dérange pas un conseil non sollicité: Si vous faites ceci juste pour apprendre comment cela fonctionne, je vous félicite! C'est un trait si génial et étonnamment rare, même parmi les programmeurs. Je tiens à vous mettre en garde contre l'utilisation de votre propre clone redux maison roulé parce que vous perdez alors beaucoup des énormes avantages de redux; devtools, middleware, enhancers. Vous perdez toutes ses assertions/vérifications d'erreurs intégrées, qui sont en fait la plupart du code en redux (dont certaines sont retirées dans les versions de production). Vous perdez également des correctifs pour les cas marginaux qui sont ébranlés au cours des années, ce qui est parfois la raison pour laquelle une bibliothèque donnée peut sembler inutilement complexe à n'importe qui sans ce contexte.

Vous pouvez ajouter toutes ces choses, mais il serait juste Redux

Si vous décidez d'aller dans cette voie, voir quelques-uns des clones à base RxJS existants pour l'inspiration (ou collaboration) sur le vôtre:

Source

2017-10-05 18:33:08 jayphelps

Wow, réponse du créateur lui-même, cool! Merci pour votre conseil et votre réponse! J'avais déjà lu le "pourquoi vous l'avez fait avec Redux et pas à partir de zéro?" de l'article de Ben Lesh ici: [article de Ben Lesh] (https://medium.com/@benlesh/redux-observable-ec0b00d2eb52) – TheoH

De rien! – jayphelps

Réimplement redux observable avec seulement RxJs?

Répondre

Questions connexes