동적으로 Redux 감속기 생성

Redux에서 감속기를 동적으로 만드는 방법에 대해서는 약간 혼란 스럽습니다. 이 주제에 대한 몇 가지 Stackoverflow 질문을 찾았지만 여러 유스 케이스를 다루는 것으로 보이며 제안 된 솔루션과 혼돈 스럽습니다.동적으로 Redux 감속기 생성

여기가 나의 사용 사례입니다. 사용자가 사용할 수있는 React DnD 구성 요소 팔레트가 있습니다. 사용자가 지정된 놓기 영역으로 구성 요소를 끌면 시각적 표현과 참조를 위해 간단한 div를 작성합니다. 구성 요소에는 소품 ID가 포함되며 ID가 div에 추가 될 때 해당 ID가 추가되면 전역 상태 개체의 특성으로 구성 요소 ID가있는 삭제 된 구성 요소에 대한 새 축소기를 만듭니다.

이 ID는 전역 상태 개체의 특성을 UI의 div에 매핑합니다.

나는 다소 여기에 솔루션 제공을 따를 수 있습니다,하지만 난 routes.js 섹션에 올 때 손실 얻을 : 난 항상 내 감속기를 구성 얼마나 How to dynamically load reducers for code splitting in a Redux application?

이입니다. 이 구조를 사용하여 어떻게 든 새로운 감속기를 동적으로 생성 할 수 있습니까?

감속기 /하는 index.js

import { combineReducers } from 'redux'; 
import usersReducer from './users_reducer.js'; 

const rootReducer = combineReducers({ 
    users: usersReducer 
}); 

export default rootReducer;

이경/users_reducer.js

import { 
    FETCH_USERS 
} from '../actions/types'; 

const INITIAL_STATE = { all: [], user: {} }; 

export default function(state = { INITIAL_STATE }, action) { 

    switch (action.type) { 
     case FETCH_USERS: 
      return {...state, all: action.payload }; 
     default: 
      return state; 
    } 

}

하는 index.js

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import { Provider } from 'react-redux'; 
import { createStore, applyMiddleware } from 'redux'; 
import { Router, browserHistory } from 'react-router'; 
import reducers from './reducers'; 
import routes from './routes.js'; 
import promise from 'redux-promise'; 
import reduxThunk from 'redux-thunk'; 
import logger from 'redux-logger'; 

const createStoreWithMiddleware = applyMiddleware(
    reduxThunk, 
    logger() 
)(createStore); 

ReactDOM.render(
    <Provider store={createStoreWithMiddleware(reducers)}> 
    <Router history={browserHistory} routes={routes}/> 
    </Provider> 
    , document.querySelector('#app') 
);

상관 이 흐름을 구조화하는 방법에 대한 조언은 크게 감사하겠습니다!

출처

2016-08-19 B_McG

동적으로 감속기를 생성하는 것은 감속기 코드가 아직 작성하지 않은 경우 코드 분할에 유용합니다. 귀하의 경우에는 DnD 구성 요소에 대한 감속기를 장착하고 다음과 같은 상태를 모델링합니다.

{ 
    users: { all: [], user: {} }, 
    dnd: { all: [], components: {} }, 
}

출처

2016-10-01 08:32:23

동적으로 Redux 감속기 생성

답변

관련 문제