redux thunk 异步逻辑的理解，进来，学不会的来捶我

记住以下几点：

Redux的中间件是为了来处理异步逻辑

最常见的异步中间件是 Thunk ，在用configureStore 创建Store 的同时，也 默认设置thunk中间件

不请求数据的情况

任务1： 编写一个thunk 函数，在组件内dispatch 它

// 定义 thunk 函数时 ，总是将 dispatch 和 get State 作为它的参数 ，在需要的时候使用它
const exampleThunkFunction = (dispatch, getState) => {
  const stateBefore = getState()
  console.log(`Counter before: ${stateBefore.counter}`)
  dispatch(increment())
  const stateAfter = getState()
  console.log(`Counter after: ${stateAfter.counter}`)
}

//通过 `store.dispatch 函数` 将thunk函数 传递给 store
store.dispatch(exampleThunkFunction)

1. 通常将dispatch和getState 作为 函数的参数，这两个参数 是store提供的方法，

2. 定义完后，在组件内dispatch 它 ，store 将会执行 里面的 逻辑，注意 里面的代码是同步执行的顺序

任务二：编写一个thunk creactor 函数，并且在组件内dispatch 它

const logAndAdd = amount => {
  return (dispatch, getState) => {
    const stateBefore = getState()
    console.log(`Counter before: ${stateBefore.counter}`)
    dispatch(incrementByAmount(amount))
    const stateAfter = getState()
    console.log(`Counter after: ${stateAfter.counter}`)
  }
}

store.dispatch(logAndAdd(5))

1. 为了和dispatch actioncreactor一样，我们通常将thunk 函数 用一个新的函数封装，然后可以传入参数

请求数据的情况