2016-05-01 14 views
2

を持っていない可能性があり、私はReddit API tutorial以下、簡単な反応-Reduxの - AJAXの作業例を作成しようとしましたが、私はこのエラーを取得:は+ Reduxのに反応 - 不明なエラー:アクションが未定義の「タイプ」プロパティに

Uncaught Error: Actions may not have an undefined "type" property. Have you misspelled a constant? 

App.jsx

index.jsx

dispatch(fetchProducts(this.props));:エラーがスローされることにより、

import React, { Component } from 'react'; 
import ReactDOM from 'react-dom'; 
import { compose, createStore, applyMiddleware } from 'redux' 
import { Provider } from 'react-redux'; 
import thunkMiddleware from 'redux-thunk'; 
import createLogger from 'redux-logger'; 
import { createDevTools, persistState} from 'redux-devtools'; 

import DevTools from './DevTools.jsx'; 
import App from './App.jsx'; 
import rootReducer from './reducers.js'; 

const loggerMiddleware = createLogger(); 

function configureStore(initialState) { 
    return createStore(
     rootReducer, 
     initialState, 
     DevTools.instrument(), 
     applyMiddleware(
      thunkMiddleware, 
      loggerMiddleware 
     ), 

     // Lets you write ?debug_session=<name> in address bar to persist debug sessions 
     persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/)) 
    ) 
} 

const store = configureStore(); 

ReactDOM.render(
<Provider store={store}> 
    <App /> 
</Provider>, document.getElementsByClassName('products')[0]); 
+1

提供されたコードを関連性があると思われる範囲に絞り込んでください。難しい問題のアプリ全体を読む。あなたの問題については、名前付きインポートとしてredux-thunkをインポートしているようです。デフォルトのインポートでなければなりません。 '輸入thunkMiddlewareから' redux-thunk''。 –

+0

@ShaneCavaliere返信ありがとうございます。私は自分の質問を編集し、私の質問でコードを減らそうとしました(私はreduxで新しいです)。私はデフォルトのインポートとして 'thunkMiddleware'を変更しましたが、それは役に立ちませんでした。 – Matt

+1

ミドルウェアは 'createStore'の3番目の引数でなければなりません。ドキュメンテーション:' createStore(reducer、[initialState]、[enhancer]) ' - devツールインジェクションを削除してみてください。 – lux

答えて

3

あなたはちょうどあなたのエンハンサーを構成するのを忘れて、あなたがユニークenhancerを提供するために、composeにすべての促進剤を必要とするので、createStoreへの3番目の引数は関数でなければなりません:

index.jsx

import React, { Component } from 'react'; 
import ReactDOM from 'react-dom'; 
import { compose, createStore, applyMiddleware } from 'redux' 
import { Provider } from 'react-redux'; 
import thunkMiddleware from 'redux-thunk'; 
import createLogger from 'redux-logger'; 
import { createDevTools, persistState} from 'redux-devtools'; 

import DevTools from './DevTools.jsx'; 
import App from './App.jsx'; 
import rootReducer from './reducers.js'; 

const loggerMiddleware = createLogger(); 

function configureStore(initialState) { 
    return createStore(
     rootReducer, 
     initialState, 
     compose(
      applyMiddleware(
       thunkMiddleware, 
       loggerMiddleware 
      ), 
      DevTools.instrument(), 
      persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/)) 
     ) 
    ) 
} 

const store = configureStore(); 

ReactDOM.render(
<Provider store={store}> 
    <App /> 
</Provider>, document.getElementsByClassName('products')[0]); 

Redux DevTool doc

関連する問題