Как получить данные о загрузке компонента, используя React-Redux и Ax ios?

Question

Мне нужно извлечь данные из API при загрузке компонента, я использую ax ios для извлечения данных, мне нужно сохранить ответ в состояние и вернуться при загрузке компонента. Но я могу сделать, как новичок в этом.

Мои коды, как показано ниже.

Продажи. js: (Здесь я выбираю мои компоненты)

function SalesDesk() {
    return (
        <div>
             <FoodScreen />
        </div>
    )}
export default SalesDesk;

FoodScreen. js (Здесь я должен перечислить свои результаты в переменную, чтобы отобразить ее позже)

function FoodScreen() {
    return(
        <div className="sdFoodScreenMain">
        {console.log(items)} // The results should be displayed here
        </div>
    )}
export default FoodScreen;

Маршрутизатор. js (Здесь где где я использую свой топор ios роутер)

const API_URL = `https://jsonplaceholder.typicode.com/`; //Mock api for test purposes

export const GetAllItems = () => {
  return (dispatch) => {
      axios.get(API_URL)
          .then(response => {
              dispatch(allItemsList(response.data));
          })
  }
};

ItemsReducer. js (Редуктор Logi c)

const ItemsReducer =(state:Array  = null, action) =>{
    if (action.type === 'ALL_ITEMS') {
        return GetAllItems ;
    } else {
        return state= null;
    }
};
export default ItemsReducer

SalesAction. js (Список действий)

export const allItemsList = () => {
    return {
        type: 'ALL_ITEMS'
    };
};

Все, что мне нужно сделать, - это извлечь данные из API и отобразить их в консоли, когда компонент рендерит. может отображать его в карте блоков div для будущих целей. Я новичок в реакции и Redux, поэтому игнорируйте, если какие-либо логики c или проблемы с реализацией.

Answer 1

На первом Маршрутизаторе. js - это недопустимое имя (api. js et c). Вы должны подключить Sales. js к Redx, используя {connect} из 'response-redux'. Смотрите там https://redux.js.org/basics/usage-with-react и вызывайте действие для извлечения данных в Sales. js