我有一个非常简单的行动被派遣,基本上是为了确保一切正常。不幸的是我一直在:
Uncaught TypeError: _this2.props.testFunction is not a function
我已经检查了一切,一切都很好。这是我的代码:
//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,任何人都知道可能出现什么问题?
修改:修复了动作类型
Edit2:这是我在container / test.js中导入的东西
import React, {Component} from 'react';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {testFunction} from '../actions/actions';
答案 0 :(得分:0)
Figured it out:
I was using export default for connect and exporting my component. While importing just the component.
I can't believe I did that!