Created
June 7, 2016 07:21
-
-
Save lanwin/7ca2df3b9b582acfc66530f31790d483 to your computer and use it in GitHub Desktop.
Redux devtools extension with mori
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <body> | |
| <script src="/node_modules/redux/dist/redux.js" type="text/javascript"></script> | |
| <script src="/node_modules/mori/mori.js" type="text/javascript"></script> | |
| <script type="text/javascript"> | |
| "use strict"; | |
| function reducer(){ | |
| return mori.hashMap('key','value'); | |
| } | |
| var store = Redux.createStore(reducer, null, window.devToolsExtension({ | |
| select:function(state){return mori.toJs(state);} | |
| })); | |
| store.dispatch({type:'test'}); | |
| console.log('state: ',store.getState()); | |
| </script> | |
| </body> | |
| </html> |
What do you think of passing instead a function for serialization like
var store = Redux.createStore(reducer, window.devToolsExtension && window.devToolsExtension({
serializeState: function(key, value){
if (value && mori.isMap(value)) { return mori.toJs(value); }
return value;
}
}));It would allow to have mixed data in states (and for action payloads especially), and also to do better serialization (with mori.intoArray for example).
Thanks for fixing it this fast!!!
I am not sure about that API. For what exactly this is called? The key value thing confuses me a little bit.
mori.toJs can convert an entire state tree to plain js even if not all objects are mori collections.
Check it. Works like a charm 💃 👍
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
npm install mori
npm install redux
npm install http-server
.\node_modules.bin\htt-server
Mori uses its own data structures (here a hashMap). It would be nice if the devtools extension could get an selector function (as in my example obove) to transform the state before its getting display by the devtools extension.