如何用thunk在react-redux钩子中进行异步调用？

Question

我开始学钩子了。但是我不明白异步调用是如何工作的。早些时候我被使用

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

然后调用我的this.props.actionQR.myFunc（），但是我应该用useDispat（）做什么？如果我只是调用

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

然后我的< code > foo() don t < code > console . log(2)

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

我正在使用thunk

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

Answer 1

useDispatch（）hook将返回对dispatch函数的引用，您不向它传递操作，而是获得 0.05 dispatch）操作。

所以基本上应该是这样的:

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

您可以从响应冗余文档中获取更多详细信息