错误：操作必须是普通对象，使用自定义中间件进行异步操作

我花了几天的时间寻找这个答案，但我仍然不知道自己做错了什么。我有其他项目设置完全相同的方式，从api的罚款提取数据。所有其他的答案说的行为如何需要返回对象，据我可以告诉我的是错误：操作必须是普通对象，使用自定义中间件进行异步操作

index.js

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import { createStore, applyMiddleware } from 'redux'; 
import { Provider } from 'react-redux'; 
import { createLogger } from 'redux-logger'; 
import Thunk from 'redux-thunk'; 
import reducer from './reducers/reducer'; 
import App from './App'; 

import './css/index.css'; 
import './css/font-awesome.css'; 
import './css/bulma.css'; 

const logger = createLogger(); 
const store = createStore(reducer, applyMiddleware(Thunk, logger)); 

ReactDOM.render(
    <Provider store={store}> 
    <App /> 
    </Provider>, document.getElementById('root'));

组件调用mapDispatchToProps变化

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { searchRepositories } from '../actions/searchActions'; 

class Results extends Component { 

    componentDidMount() { 
    this.props.searchRepositories(); 
    } 

    render() { 
    return (
     <div>Some Stuff</div> 
    ); 
    } 
} 

const mapDispatchToProps = (dispatch) => { 
    return { 
    searchRepositories:() => { 
     dispatch(searchRepositories()); 
    }, 
    }; 
}; 

const mapStateToProps = (state) => { 
    return { 
    repositories: state.repositories, 
    }; 
}; 


export default connect(mapStateToProps, mapDispatchToProps)(Results);

减速机：

import * as types from '../actions/types'; 
import initialState from './INITIAL_STATE'; 


function reducer(prevState = initialState, action) { 
    if (!action) return prevState; 

    switch (action.type) { 
    case types.FETCH_REPOS_REQUEST: 
     return { ...prevState, loading: true }; 

    case types.FETCH_REPOS_SUCCESS: 
     return { 
     ...prevState, 
     loading: false, 
     repositories: action.data, 
     error: '', 
     }; 

    case types.FETCH_REPOS_ERROR: 
     return { ...prevState, error: 'Encountered an error during GET request' }; 

    default: 
     return prevState; 
    } 
} 

export default reducer;

动作创建者：

import axios from 'axios'; 
import * as types from './types'; 
import { ROOT } from '../config'; 


export function searchRepositoriesRequest() { 
    return { 
    type: types.FETCH_REPOS_REQUEST, 
    }; 
} 

export function searchRepositoriesSuccess(repositories) { 
    return { 
    type: types.FETCH_REPOS_SUCCESS, 
    data: repositories, 
    }; 
} 

export function searchRepositoriesError(error) { 
    return { 
    type: types.FETCH_REPOS_ERROR, 
    data: error, 
    }; 
} 

export function searchRepositories() { 
    return function (dispatch) { 
    dispatch(searchRepositoriesRequest()); 
    return axios.get(`${ROOT}topic:ruby+topic:rails`).then((res) => { 
     dispatch(searchRepositoriesSuccess(res.data)); 
    }).catch((err) => { 
     dispatch(searchRepositoriesError(err)); 
    }); 
    }; 
}

我已经得到了这个axios api请求工作使用react this.state，我只是把它放在组件安装。如果任何人都能看到我要出错的地方，那会对我有所帮助。

来源

2017-08-01 biwhitfield

好吧，看起来我使用的是早期版本的redux，我安装的redux-thunk版本不喜欢！我更新到最新版本的redux，现在它应该调用它。

我还不确定为什么其他安装了旧版本的项目仍然可以正常工作...

来源

2017-08-01 16:36:15 biwhitfield

错误：操作必须是普通对象，使用自定义中间件进行异步操作

回答

相关问题