1

React + Reduxにおけるdispatch時のエラー

概要

現在、TypeScript + React + Reduxを用いた開発を行っています。
仮のログアウト機能を実装中にエラーが発生しました。
具体的には、actionをdispatchした際にエラーが発生します。
どうやら下記のjwtLogout内のdispatchで発生している様です。
自分なりに色々調べてみましたが, connect等を用いた解決方法は見つかれど、Hooksを用いた解決方法が中々見つからず、今回は質問させて頂きました。
どなたか解決方法のご教授お願いいたします。

エラーの内容

TypeError: dispatch is not a function

該当のコード

// reducer

import * as actionTypes from '../utils/actionTypes'
import * as actions from '../actions'

type Actions = (
    | ReturnType<typeof actions.startRequest>
    | ReturnType<typeof actions.completeRequest>
)

interface iState {
    isRequesting: boolean
}

const initialState: iState = {
    isRequesting: false,
}

const RequestReducer = (state: iState = initialState, action: Actions) => {
    switch (action.type) {
        case actionTypes.START_REQUEST:
            return {
                ...state,
                isRequesting: true
            }
        case actionTypes.COMPLETE_REQUEST:
            return {
                ...state,
                isRequesting: false
            }
    }

    return state
}

export default RequestReducer
// actions

import { Dispatch } from "react"
import { Action } from "redux"
import * as actionTypes from "../utils/actionTypes"

export interface Actions {
    type: String;
    payload: any;
}

略 。。。

export const jwtLogout = () => {
    return async (dispatch: Dispatch<Action>) => {
        // TODO: gRpcログアウト && try-catch
        dispatch({ type: actionTypes.START_REQUEST })

        console.log('Logout')
        localStorage.removeItem('token')

        dispatch({ type: actionTypes.COMPLETE_REQUEST })
        dispatch({ type: actionTypes.UNAUTHENTICATE_USER })
        dispatch(setNotification('success', 'ログアウト成功!'))
    }
}
3
  • dispatch内のオブジェクトにpayloadも追加したほうが良いような気がします.dispatch({ type: ... , payload: ... })みたいな感じです.
    – blank
    Commented 2020年1月21日 16:42
  • 回答される方へ teratail.com/questions/236645
    – htb
    Commented 2020年1月21日 23:47
  • payloadも追加してみましたが、ダメでした…。
    – khkhkh
    Commented 2020年1月22日 5:47

1 件の回答 1

0

放置して開発を進めていたところ、なぜか動作する様になりました…。恐らく他の部分の影響が出ていた模様…。
ありがとうございました!

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。