1. import React from 'react'
    2. import ReactDOM from 'react-dom'
    3. import { createHashHistory } from 'history'
    4. import { createStore, combineReducers, applyMiddleware } from 'redux'
    5. import { Provider, connect } from 'react-redux'
    6. import createSagaMiddleware from 'redux-saga'
    7. import * as sagaEffects from 'redux-saga/effects'
    9. export default function (opts = {}) {
    10.     let history = opts.history || createHashHistory()
    11.     let app = {
    12.         _models: [],
    13.         model,
    14.         router,
    15.         _router: null,
    16.         start
    17.     }
    18.     function model(m) {
    19.         let prefixmodel = prefixResolve(m)
    20.         app._models.push(prefixmodel)
    21.     }
    22.     function router(router) {
    23.         app._router = router
    24.     }
    25.     function start(container) {
    26.         let reducer = getReducer(app)
    27.         let sagas = getSagas(app)
    28.         //let store = createStore(reducer)
    29.         let sagaMiddleware = createSagaMiddleware()
    30.         app._store = applyMiddleware(sagaMiddleware)(createStore)(reducer)
    31.         sagas.forEach(sagaMiddleware.run)
    32.         ReactDOM.render(
    33.             <Provider store={app._store}>
    34.                 {app._router('history')}
    35.             </Provider>
    36.             , document.querySelector(container))
    37.     }
    38.     return app
    39. }
    40. function getReducer(app) {
    41.     let reducers = {}
    42.     for (let m of app._models) {//m是每个model的配置
    43.         reducers[m.namespace] = function (state = m.state, action) {//组织每个模块的reducer
    44.             let everyreducers = m.reducers//reducers的配置对象，里面是函数
    45.             let reducer = everyreducers[action.type]//相当于以前写的switch
    46.             if (reducer) {
    47.                 return reducer(state, action)
    48.             }
    49.             return state
    50.         }
    51.     }
    52.     return combineReducers(reducers)//reducer结构{reducer1:fn,reducer2:fn}
    53. }
    55. function prefix(obj, namespace) {
    56.     return Object.keys(obj).reduce((prev, next) => {//prev收集，next是每个函数名
    57.         let newkey = namespace + '/' + next
    58.         prev[newkey] = obj[next]
    59.         return prev
    60.     }, {})
    61. }
    62. function prefixResolve(model) {
    63.     if (model.reducers) {
    64.         model.reducers = prefix(model.reducers, model.namespace)
    65.     }
    66.     if (model.effects) {
    67.         model.effects = prefix(model.effects, model.namespace)
    68.     }
    69.     return model
    70. }
    72. function getSagas(app) {
    73.     let sagas = []
    74.     for (let m of app._models) {
    75.         sagas.push(function* () {
    76.             for (const key in m.effects) {//key就是每个函数名
    77.                 const watcher = getWatcher(key, m.effects[key])
    78.                 yield sagaEffects.fork(watcher) //用fork不会阻塞
    79.             }
    80.         })
    81.     }
    82.     return sagas
    83. }
    84. function getWatcher(key, effect) {
    85.     return function* () {
    86.         yield sagaEffects.takeEvery(key, function* (action) {//对action进行监控,调用下面这个saga
    87.             yield effect(action, sagaEffects)
    88.         })
    89.     }
    90. }

    // router.js

    1. import * as routerRedux from 'react-router-redux';
    2. export * from 'react-router-dom';
    3. export { routerRedux }