Redux , , use case {actionTypes, actions, reducer}
. , 95% reducer/actions .
, , .
// widgets.js
// Actions
const LOAD = 'my-app/widgets/LOAD';
const CREATE = 'my-app/widgets/CREATE';
const UPDATE = 'my-app/widgets/UPDATE';
const REMOVE = 'my-app/widgets/REMOVE';
// Reducer
export default function reducer(state = {}, action = {}) {
switch (action.type) {
// do reducer stuff
default: return state;
}
}
// Action
export function loadWidgets() {
return { type: LOAD };
}
export function createWidget(widget) {
return { type: CREATE, widget };
}
export function updateWidget(widget) {
return { type: UPDATE, widget };
}
export function removeWidget(widget) {
return { type: REMOVE, widget };
}
...
reducer()
export default
.export
.npm-module-or-app/reducer/ACTION_TYPE
action .UPPER_SNAKE_CASE
export
. , reducer
action , .Redux {actionType, action, reducer}
.
Java jars beans . Ruby gems . reducer "redux" "ducks" .
.
import { combineReducers } from 'redux';
import * as reducers from './ducks/index';
const rootReducer = combineReducers(reducers);
export default rootReducer;
.
import * as widgetActions from './ducks/widgets';
... bindActionCreators()
action import
.
action export
. . **** action export
. action , action . .
import {loadWidgets, createWidget, updateWidget, removeWidget} from './ducks/widgets';
// ...
bindActionCreators({loadWidgets, createWidget, updateWidget, removeWidget}, dispatch);
React Redux Universal Hot Example ducks . /src/redux/modules
.
[](https://github.com/erikras/react-redux-universal-hot-example/commit/3fdf194683abb7c40f3cb7969fd1f8aa6a4f9c57). .
! issue @erikras .
!
-- Erik Rasmussen