React学習アウトプット（redux-operations）

今回のアウトプットはreduxにおけるoperationsになります。

operationsの役割としては、storeの情報を外部から取得した情報（APIとか）を元に変更する時に非同期処理でasync awaitを使えるためにoperationsを行うらしいです。

方法としては簡単！

ただ無名関数をreturnすれば良いだけ！

以下コード例になります。

import { signInAction } from './action'

export const signIn = () => {
  // 非同期処理の関数をリターン
  return async (dispatch, getState) => {
    await axios.get('https://api.github.com/users/aki-743').then((res) => {
      dispatch(signInAction({
        isSignedIn: true,
        username: res.login
      })
    }))
  }
}

このようにして非同期処理を実行しつつ、Storeの内容を変更することが可能。

ここらへんはVueと少し似ているところがあったので理解はし易かった。