目录架构:
/src
——actions
——components(纯组件)
——containers
——constants (常量定义:actions、apiurls)
——reducers
——sagas
——store(配置Store)
——service (api目录)
——root.js
入口文件:index.android.js和index.ios.js,只需要注册一个Root组件:
import {AppRegistry} from 'react-native'; import Root from './src/Root' AppRegistry.registerComponent('myapp', () => Root);
/src/root.js:配置Store、导出根组件、:
import React from 'react'; import { Provider } from 'react-redux'; import configureStore from './store/configureStore'; import rootSaga from './sagas'; import App from './containers/App'; const store = configureStore(); store.runSaga(rootSaga); const Root = () => ( <Provider store={store}> <App /> </Provider> ) export default Root;
/src/store/configureStore.js:配置store:
import { createStore,applyMiddleware } from 'redux'; import createSagaMiddleware,{ END } from 'redux-saga'; import { createLogger } from 'redux-logger'; import rootReducer from '../reducers'; const middlewares = [];//中间件列表 const sagaMiddleware = createSagaMiddleware(); middlewares.push(sagaMiddleware); if (__DEV__) { middlewares.push(createLogger()); } const initialState = {};//初始化state export default function configureStore(){ const store = createStore( rootReducer, initialState, applyMiddleware(...middlewares) ); store.runSaga = sagaMiddleware.run; store.close = () => store.dispatch(END); return store; }
其他:
/src/containers/App.js:存放根组件App
/src/reducers/index.js:导出combineReducers好的rootReducer
/src/sagas/index.js:导出rootRagas
/src/constants/ActonTypes.js :action.type定义
/src/constants/Urls.js :apiurl定义