Блог

Главная - Вопросы по программированию - переопределение, возвращающее только начальное состояние?

переопределение, возвращающее только начальное состояние?

#reactjs #typescript #redux #react-redux #react-typescript

Вопрос:

Не знаю, почему это не работает. Редуктор возвращает только начальные значения состояния. Редуктор:

 import { Actions, actionTypes, todoData } from "../actions/actionTypes";

interface interfaceState {
  loading: boolean;
  todos?: todoData[];
  err?: String;
}

let initialState: interfaceState = {
  loading: false,
  todos: [],
};
export const reducer = (
  state: interfaceState = initialState,
  action: Actions
): interfaceState => {
  switch (action.type) {
    case actionTypes.FETCHING_LOADING:
      return {
        ...state,
        loading: true,
      };

    case actionTypes.FETCHING_SUCCESS:
      return {
        ...state,
        todos: action.payload,
      };
    case actionTypes.FETCHING_FAIL:
      return {
        ...state,
        err: action.payload,
      };
    default:
      return state;
  }
};

Действия

 import { Dispatch } from "redux";
import axios from "axios";

import { actionTypes, Actions } from "./actionTypes";
export const fetchData = () => async (dispatch: Dispatch<Actions>) => {
  dispatch({ type: actionTypes.FETCHING_LOADING });
  try {
    const data = await axios.get("http://localhost:5000/read");
    dispatch({
      type: actionTypes.FETCHING_SUCCESS,
      payload: data.data,
    });
    console.log(data);
  } catch (err) {
    dispatch({
      type: actionTypes.FETCHING_FAIL,
      payload: err,
    });
  }
};

Типы действий

 export enum actionTypes {
  FETCHING_LOADING = "FETCHING_LOADING",
  FETCHING_SUCCESS = "FETCHING_SUCCESS",
  FETCHING_FAIL = "FETCHING_FAIL",
}

type actionLoading = {
  type: actionTypes.FETCHING_LOADING;
};

type actionSuccess = {
  type: actionTypes.FETCHING_SUCCESS;
  payload: todoData[];
};

type actionFail = {
  type: actionTypes.FETCHING_FAIL;
  payload: string;
};

export interface todoData {
  todo_items: string;
  _id: string;
}

export type Actions = actionLoading | actionSuccess | actionFail;

Ответ №1:

попробуйте удалить «: Действия»

Окончательный код:

 import { Actions, actionTypes, todoData } from "../actions/actionTypes";

interface interfaceState {
  loading: boolean;
  todos?: todoData[];
  err?: String;
}

let initialState: interfaceState = {
  loading: false,
  todos: [],
};
export const reducer = (
  state: interfaceState = initialState,
  action
): interfaceState => {
  switch (action.type) {
    case actionTypes.FETCHING_LOADING:
      return {
        ...state,
        loading: true,
      };

    case actionTypes.FETCHING_SUCCESS:
      return {
        ...state,
        todos: action.payload,
      };
    case actionTypes.FETCHING_FAIL:
      return {
        ...state,
        err: action.payload,
      };
    default:
      return state;

Комментарии:

1. Однако действия-это «тип» для действий. Если я удалю действия, то typescript автоматически выдаст мне ошибку. Я попробовал «действие: любое», но все равно ничего не вышло.

Метки: ,