Question

我尝试在Reddit API tutorial之后创建一个简单的react-redux-ajax工作示例，但是我收到了这个错误：

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

错误是由：

引发的 App.jsx

中的

dispatch(fetchProducts(this.props));

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,
        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]);

Answer 1

您忘了撰写增强工具，createStore的第三个参数必须是一个函数，因此您需要compose所有增强工具提供唯一的enhancer：

<强> 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

React + Redux - 未捕获错误：操作可能没有未定义的“类型”属性

1 个答案: