简体   繁体   English

Redux无法执行分派操作,出现未捕获的typeError,表示这不是函数

[英]Dispatched action with Redux not working, getting uncaught typeError, saying it's not a function

I have a very simple action being dispatched, basically to make sure everything is working fine. 我将分派一个非常简单的操作,基本上是为了确保一切正常。 Unfortunately I keep getting: 不幸的是我不断得到:

Uncaught TypeError: _this2.props.testFunction is not a function

I've checked everything and it all seems fine. 我检查了所有内容,一切似乎都很好。 Here is my code: 这是我的代码:

//index.js
const loggerMiddleware = createLogger();
const middleware = applyMiddleware(thunkMiddleware, loggerMiddleware);

const store = createStore(allReducers, middleware);

export default class Help2 extends Component{
    render(){
        return (
            <Provider store={store}>
                <App/>
            </Provider>
        );
    }
}

//reducers/index.js
const allReducers = combineReducers({
    topic: TopicsReducer
});

export default allReducers;

//reducer/test-reducers.js
export default function(state=null, action){
    switch(action.type){
        case 'TEST_REDUCER':
            return action.payload; //will return that object
            break;
    }
    return state;
}

//actions.js
export function testFunction(topicsUrl){
    console.log('I have been called');
     const request= axios.get(topicsUrl);
     return (dispatch)=>{
         request.then(({data})=>{
             dispatch({type: 'TEST_REDUCER', payload: data,});
         });
     }

};

//container/test.js
export class Test extends Component{
    render(){
        return(
                <div onClick={()=>this.props.testFunction("https://api.someApi.com/")}>Click here to test</div>
        );
    }
}

function mapStateToProps(state){
    return{
        topic: state.topic
    }
}

function matchDispatchToProps(dispatch){
    return bindActionCreators({testFunction: testFunction}, dispatch);
}

export default connect(mapStateToProps, matchDispatchToProps)(Test);

Soo, anyone have a clue what could be going wrong? 如此,有人知道可能出什么问题了吗?

Edit: fixed the action type 编辑:修复了动作类型

Edit2: Here is the stuff I am importing in container/test.js Edit2:这是我在container / test.js中导入的东西

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

Figured it out: 弄清楚了:

I was using export default for connect and exporting my component. 我在使用export default进行连接和导出组件。 While importing just the component. 同时仅导入组件。

I can't believe I did that! 我不敢相信我做到了!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM