Получить значение функции отправки с помощью почтового запроса с помощью React Hooks - PullRequest
Новая
       0

Получить значение функции отправки с помощью почтового запроса с помощью React Hooks

0 голосов
/ 27 мая 2020

Привет, я новый разработчик в ReactJS, и у меня есть вопросы по этому поводу. Я изучаю хуки и использую ContextApi для управления состоянием. Я создаю часть аутентификации со страницы входа на главную. Но когда я это делаю, я сталкиваюсь с логическими или нелогичными вещами. Когда я отправляю данные для метода post, метод отправки не отправляет возвращаемое значение, хотя я беру код состояния HTTP 200. Метод отправки возвращает мне undefined. Я имею в виду, что если я поймаю код состояния на моей странице входа, я попытаюсь сохранить историю pu sh для домашней страницы. Но я этого не делал. Есть кое-что, что я упускаю. Что это ? Не могли бы вы помочь мне в этом вопросе?

Index.tsx; 

 <LoginContextProvider>
        <HashRouter>
          <App />
        </HashRouter>
 </LoginContextProvider>

Login.tsx для контекста 

import React, { Dispatch, useReducer } from 'react';
import { Actions, initialState, IState, reducer } from '../reducers/Login';

interface IContextProps {
  state: IState;
  dispatch: Dispatch<Actions>;
}
export const LoginContext = React.createContext({} as IContextProps);

export const LoginContextProvider = (props: any) => {
  const [state, dispatch] = useReducer(reducer, initialState);

  const value = { state, dispatch };
  return (
    <LoginContext.Provider value={value}>
      {props.children}
    </LoginContext.Provider>
  );
};

export default LoginContextProvider;

Login.tsx для Reducer: 

export interface IState {
  isAuth: any;
}
export const initialState: IState = {
  isAuth: false
};

interface ILogin {
  type: "LOGIN";
  payload: {
    email: string,
    password: string,
  }
}

export type Actions = ILogin | ILogout;

export const reducer = (state: IState, action: Actions) => {
  switch (action.type) {

    case "LOGIN":
      const userInfoToSend = {
        email: "test@test.com",
        password: "test"
      }

      // I have special framework and it works correctly for post.
      ..examplePost({
        request: {
          url: "exampleUrl",
          method: 'POST',
          body: {
            title: '',
            headers: {
              'Content-Type': 'application/json',
              Accept: 'application/json',
            },
            body: JSON.stringify(userInfoToSend),
          },
        },
        onSuccess: (_: any, state: any) => {
           return state.StatusCode;
        },

        onError: (_: any, state: any, error: any) => {
           return state.StatusCode;
        },
      });


    default: return state;
  }
};

Вход для отправки формы: 

  const handleSubmit: any = (e: Event) => {
    const user = {
      email: exampleState.email,
      password: exampleState.password, };

    const test = dispatch({ type: "LOGIN", payload: user })
    console.log(test) // returns undefined

     /*
      if (response==200) {
            history.push('/home')
        }
    */
    e.preventDefault();
  };
...