How to return the desired type in action creator React Typescript Redux

Matvey Androsyuk 0
Viewed 23

I have a problem. Look at my code first:

export const login = (email: string, password: string) => {
    return async (dispatch: Dispatch<UserAction>) => {
        try {
            dispatch({type: UserActionTypes.FETCH_USER})
            const response = await axios.post<IUser>('http://localhost:8080/auth/signIn', {email, password})
            dispatch({type: UserActionTypes.FETCH_USER_SUCCESS, payload: response.data})
            return response.data
        }catch (e) {
            dispatch({
                type: UserActionTypes.FETCH_USER_ERROR,
                payload: 'Произошла ошибка при загрузке пользователя'
            })
        }
    }
}

It's my action creator, where i authentificate user.

        let principal = await login(email.value, password.value)
        console.log(principal)

Here I try to get the response, i return in action creator, i get not what i need and i can't get fields i need. enter image description here

But what i see in console console.log(principal): this is object, i needed, but i can't get his fields: enter image description here

redux reactjs typescript
1 Answers

You need to use useDispatch hook. https://react-redux.js.org/api/hooks#usedispatch

const dispatch = useDispatch();

And then dispatch the login action.

dispatch(login(email.value, password.value));

also you do not need to await when you dispatch an action.

Rohit Chhabra0
Related