react.js - dispatch is not a function

问题描述

问 题

react结合redux发起异步请求，把返回的结果存储在store中，提示错误(已解决)

dispatch is not a function

代码：

import axios from 'axios';

const url='https://cnodejs.org/api/v1/';

function getTopicList (listData) {
    return {
        type : 'TOPICS',
        listData : listData
    }
}

function getAllTopicListData (cb) {
    axios.get(url+'topics',{
        params: {
            page: 1,
            limit: 10
        }
    }).then(function(res){
        cb(res.data.data);
        console.log(res.data);
    }).catch(function(error){
        console.log(error)
    })
}

export function fetchAllTopics(){
    return (dispatch)=>{
        getAllTopicListData(function(listData){
            dispatch(getTopicList(listData))//根据提示这个dispatch有问题的
        })
    }
}

组件中：

componentWillMount(){
        let {renderList}=this.props;
        renderList();
    }
    
const mapDispatchToProps = (dispatch) => {
    return {
        renderList : ()=>{
            dispatch(actions.fetchAllTopics)
        }
    }
}

请问是哪里有问题啊？？？感觉没什么问题啊，查询网络请求是有数据返回的，看了很久找不到哪里错了

解决方案

首先，你有引入redux-thunk的middleware吗？
其次，mapDispatchToProps不应该是这个样子吗？

const mapDispatchToProps = (dispatch) => {
    return {
        renderList : bindActionCreators(actions.fetchAllTopics, dispatch)
    }
}

或者直接：

const mapDispatchToProps = {
    renderList: actions.fetchAllTopics
}

这篇关于react.js - dispatch is not a function的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！