my response stucks i dont get error or undefined

30 views Asked by At

when i call a get request on redux my call inside of createAsyncThunk stucks i dont get any error or return undefined and my state stays in pending. Also in this code "run1" logs into console but "run2" does not

reducer

import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import axios from "axios";

export const getProducts = createAsyncThunk("getProducts", async () => {
  console.log("run1");
  const data = await axios.get(`localhost:4000/api`);
  console.log("run2");
  return data;
});

export const productsSlice = createSlice({
  name: "products",
  initialState: {
    loading: true,
    productsData: [],
  },
  reducers: {},
  extraReducers: (builder) => {
    builder.addCase(getProducts.pending, (state) => {
      state.loading = true;
    });
    builder.addCase(getProducts.fulfilled, (state, action) => {
      state.loading = false;
      state.productsData = action.payload;
    });
  },
});

export default productsSlice.reducer;

react file

const dispatch = useDispatch();
  const { loading, productsData } = useSelector((state) => state.products);

  useEffect(() => {
    dispatch(getProducts());
  }, []);
0

There are 0 answers