React-Redux - 주요 "코인"에 대한 환원제는 제공되지 않습니다.

React-Redux - 주요 "코인"에 대한 환원제는 제공되지 않습니다.

다음과 같은 에러가 표시되는 이유를 알 수 없습니다.

가게와 행동, 그리고 감량기를 설치하는 중이지 아직 아무 것도 요청하지 않았어요.

기대됩니다

앱이 정상적으로 실행되며 Redux 상태가 업데이트되지 않음

결과.

src/index.js

import React from 'react'
import ReactDOM from 'react-dom'

import { createStore, applyMiddleware, compose } from 'redux'
import { Provider } from 'react-redux'
import thunk from 'redux-thunk'
import reducer from './reducer'

import App from './App'
import css from './coinhover.scss'

const element = document.getElementById('coinhover');

const store = createStore(reducer, compose(
    applyMiddleware(thunk),
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
));

ReactDOM.render(
    <Provider store={ store }>
        <App />
    </Provider>, element);

src/reducer/index.js

import { combineReducers } from 'redux'
import { coins } from './coins'

export default combineReducers({
    coins
});

src/reducer/actions/coins.js

import * as api from '../../services/api'
import { storage, addToPortfolio } from '../../services/coinFactory'

export const ADD_COIN = 'ADD_COIN'

export function getCoin(coin) {
    return dispatch => {
        api.getCoin(coin)
            .then((res_coin)  => addToPortfolio(res_coin))
            .then((portfolio) => dispatch(updatePortfolio(portfolio)));
    }
}

export function updatePortfolio(portfolio) {
    return {
        type: ADD_COIN,
        portfolio
    }
}

finally src/reducer/coins/index.js

import { ADD_COIN } from './actions'

const initialState = [];

export default (state = initialState, action) => {
    switch(action.type) {
        case ADD_COIN:
            return action.portfolio;
        default:
            return state;
    }
}

문제의 원인은, 의 Import 방법에 있습니다.coins리듀서:

import { coins } from './coins'

후자는 ./coins 파일에서 반환된 이름 있는 내보내기를 얻으려고 합니다.

명명된 내보내기만 사용하고 있지 않습니다.export default따라서 다음과 같이 파일을 Import하면 됩니다.

import coins from './coins';

후자를 사용하면 다음과 같은 결과가 초래됩니다.coins그 후, 의 가치를 포함이 됩니다.export default; 이것은 코인 감소기가 될 것이다.

모든 Import가 올바르게 Import 되어 있는 경우에도 이 문제는 다른 이유로 발생할 수 있습니다.순환 의존성!

내 경우 파일에 순환 종속성이 있기 때문에 이러한 일이 발생했습니다.나는 부수적으로 만든 프로젝트에서 두 개의 순환 부양가족을 가지고 있었다.예:rootReducer.ts -> authSlice.ts -> rootReducer.ts.

이러한 의존관계는 디버깅이 쉽지 않은 경우가 많습니다.순환 종속성을 확인하기 위해 이 패키지를 사용했습니다.일단 순환 의존이 제거되면 모든 것이 잘 되었다.

아, 방금 찾았어, 내 동전감축기를 잘못 수입하고 있었어...

import { combineReducers } from 'redux'
import coins from './coins' // because I have coins/index.js

export default combineReducers({
    coins
});

대신

import { coins } from './coins'

이건 내 해결책이었어

import { combineReducers } from 'redux'
import { coins } from './coins'

export default combineReducers({
    coinsState: coins || (() => null) // By adding this I resolved it.
});

아무 것도 효과가 없다면 순환 의존 관계일 수 있습니다.나는 조각에 스토어 상태를 요구하는 그런 프로젝트를 했다.스토어를 사용하는 대신 스토어 자체를 Import하지 않고도 상태를 제공할 수 있는 트렁크를 사용할 수 있었습니다.이 엣지 케이스를 가지고 있으면, 덩크로부터 상태를 얻을 수 있습니다.

thunkAPI.getState()

제 경우 디폴트 속성을 리듀서에 추가하지 않았습니다.내가 넣었을 때 효과가 있었어.여기 내 코드가 있다.

const counterReducer = (state = 0, action) => {
    switch(action.type){
      case 'INCREMENT':
        return state + 1;
      case 'DECREMENT':
          return state - 1;
      default:
        return state;    
    }
  }
  
export default counterReducer;

및 콤빈데 파일

import   counter   from './counter';
import { combineReducers } from 'redux';

const allReducers = combineReducers({
    counter: counter,
   
});

export default allReducers;

언급URL : https://stackoverflow.com/questions/44791528/react-redux-no-reducer-provided-for-key-coins