BindActionCreators expects an actionCreator function for the key 'ACCOUNT_LOGIN', instead it gets the type 'string'

Question

bindActionCreators expects an actionCreator function for the key 'ACCOUNT_LOGIN', instead it gets the type 'string'.

I started getting this error today unexpectedly for all bindActionCreators in the application.
I even went to the older GIT story, where I am sure that I did not have this error, and now it also has.
The application still works, but there are pop-up errors every time you change the route.

Has anyone had this problem before? Or any idea where this could come from? I can provide more code if not enough.

Container:

 import { bindActionCreators } from 'redux'; import { connect } from 'react-redux'; import account from '../components/account'; import * as AccountActions from '../actions/account'; function mapStateToProps(state) { return { username: state.account.username, password: state.account.password, loggedIn: state.account.loggedIn, registred: state.account.registred, loading: state.account.loading, clientId: state.account.clientId }; } function mapDispatchToProps(dispatch) { return bindActionCreators(AccountActions, dispatch); } export default connect(mapStateToProps, mapDispatchToProps)(account); 

Act:

 export const ACCOUNT_LOGIN = 'ACCOUNT_LOGIN'; export function login(username, password) { return { type: ACCOUNT_LOGIN, username, password, loggedIn: false, loading: false }; ... 

Dilution:

 import { ACCOUNT_LOGIN, } from '../actions/account'; type actionType = { type: string }; const initialState = { username: '', password: '', loggedIn: false, registred: false, loading: false, clientId: '' }; export default function account(state = initialState, action: actionType) { switch (action.type) { case ACCOUNT_LOGIN: return Object.assign({}, state, { username: action.username, password: action.password, loggedIn: action.loggedIn, loading: action.loading }); } 

Mistake:

Answer 1

You export ing a const ant as _ACCOUNT_LOGIN_, and then import ing * as AccountActions .

Since v3.7.0 redux warns that no Action Creator is a function. See the transfer request for details.

Try importing the necessary actions, for example:

 import { login, … } from '../actions/account' 

In any case, for what I am testing, the functionality of the application should work properly, but, apparently, a bunch of warnings.

---

Directly related tip: you can use action creators directly in the connect() method, for example:

 import { login, … } from '../actions/account' // … export default connect(mapStateToProps,{ login, … })(account); 

Answer 2

I found a good approach for filtering an imported object (with lodash) and left only its functions inside. It helps.

 import * as itemActions from "../actions/itemActions"; // here i have strings also const filteredActions = _.pickBy(itemActions, _.isFunction); export default connect( mapStateToProps, filteredActions )(ItemContent) 

Answer 3

I solved the problem in a simple way. My problem was that I exported action types to action.js (where I export the creators of my actions). So I just created another file called actionTypes.js and I placed it there and imported inside actions.js

The only thing you need to export inside your actions is your creator of your actions.

Answer 4

try it

 import { bindActionCreators } from 'redux'; import {action1,action2,action3,action4} from '../actions'; function mapDispatchToProps(dispatch) { return bindActionCreators({action1,action2,action3,action4}, dispatch); } export default connect(mapStateToProps,mapDispatchToProps)(ComponentName); 

Answer 5

Redux 3.7.1 has just been released to solve this problem. The PR mentioned by @Lionel T is now canceled.