redux-async-initial-state
Advanced tools
Comparing version
{ | ||
"name": "redux-async-initial-state", | ||
"version": "0.0.1", | ||
"version": "0.0.2", | ||
"description": "It is simple redux middleware that helps you load redux initial state asynchronously", | ||
"main": "index.js", | ||
"main": "lib/index.js", | ||
"directories": { | ||
@@ -10,3 +10,5 @@ "test": "test" | ||
"scripts": { | ||
"test": "npm test" | ||
"build": "babel src --out-dir lib", | ||
"posttest": "npm run lint", | ||
"lint": "eslint src test" | ||
}, | ||
@@ -20,3 +22,15 @@ "keywords": [ | ||
"author": "KELiON <kelionweb@gmail.com> (http://asubbotin.ru)", | ||
"license": "ISC" | ||
"license": "ISC", | ||
"devDependencies": { | ||
"babel": "^6.5.2", | ||
"babel-cli": "^6.6.0", | ||
"babel-core": "^6.6.0", | ||
"babel-eslint": "^5.0.0", | ||
"babel-preset-es2015": "^6.6.0", | ||
"babel-preset-stage-0": "^6.5.0", | ||
"eslint": "^2.2.0", | ||
"eslint-config-airbnb": "^6.0.2", | ||
"eslint-plugin-react": "^4.1.0", | ||
"rimraf": "^2.5.2" | ||
} | ||
} |
@@ -54,2 +54,3 @@ Redux Async Initial State | ||
// We need innerReducer to store loading state, i.e. for showing loading spinner | ||
// If you don't need to handle loading state you may skip it | ||
asyncInitialState: asyncInitialState.innerReducer, | ||
@@ -71,1 +72,30 @@ })); | ||
``` | ||
## Reducer | ||
The shape of `innerReducer` is: | ||
```javascript | ||
{ | ||
loaded: false, | ||
loading: false, | ||
error: false | ||
} | ||
``` | ||
You can add it to you reducer if you want to handle loading state, i.e. to show loading spinner. Here is React example (it uses reducer, described above): | ||
```javascript | ||
import { connect } from 'react-redux'; | ||
@connect(state => ({ | ||
loading: state.asyncInitialState.loading, | ||
})) | ||
class MyComponent extends React.Component { | ||
render() { | ||
if (this.props.loading) { | ||
return <div>Loading...</div> | ||
} | ||
return ...; | ||
} | ||
} | ||
``` |
9959
143.85%14
100%187
175%100
42.86%10
Infinity%