Answer a question

I starting to learn hooks. But i dont understand how right work with async call. Earlier i was use

import * as actionQR from "../actions/qr";
...
function mapDispatchToProps(dispatch) {
    return {
        actionQR: bindActionCreators(actionQR, dispatch),
    }
} 

and after this call my this.props.actionQR.myFunc(), but what I should do with useDispatch()? if I just call

import {foo} from "../actions/qr";
...
useDispatch(foo());

then my foo() dont console.log(2)

export const foo = () => {
    console.log(1);
    return (dispatch) => {
        console.log(2);
      }
}

Im using thunk

import createRootReducer from './reducers/index';
...
const store = createStore(createRootReducer, applyMiddleware(thunk));

Answers

The useDispatch() hook will return a reference to the dispatch function, you don't pass to it an action, you get the dispatch reference and pass to it (the dispatch) the action.

So basically it should look something like this:

const dispatch = useDispatch()
dispatch(foo())

You can get more details from the react-redux DOCS