Question 330246 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – Fetching data in React's returns "undefined"

`I am trying to get a companies list from dynamodb, but I am getting return "undefined"

loadedCompanies
{
entityId: undefined,
entityType: undefined,
parentCompany: undefined,
companyType: undefined,
status: undefined
}
when I console.log(‘GET call succeeded: ‘, data) this is what I get

GET call succeeded:
(2) [{…}, {…}] 0: {entityType: ‘RealTecPro’, companyType: ‘Company’, parentCompany: ‘Real Time Technologies’, entityId: ‘f1a0a34e’, status: ‘Active’}

1: {entityType: ‘BusyBee’, companyType: ‘Company’, parentCompany: ‘IET’, entityId: ‘1334a644’, status: ‘Active’}
length: 2
[[Prototype]]: Array(0)

What is the reason of this?`

useEffect(() => {
        const fetchCompanies = async () => {
            try {
                const restOperation = get({
                    apiName: "adminbbatestApi",
                    path: "/companies",
                });
                const {body} = await restOperation.response;
                const data: any = await body.json();
                
               
                console.log('GET call succeeded: ', data);
                const loadedCompanies: CompaniesModel = {
                    entityId: data?.entityId,
                    entityType: data?.entityType,
                    parentCompany: data?.parentCompany,
                    companyType: data?.companyType,
                    status: data?.status
                }
                console.log('loadedCompanies',loadedCompanies);
                setCompaniesList(loadedCompanies);
                setIsLoading(false);
            } catch (error) {
                console.log('GET call Failed', error);
            }

        };
        fetchCompanies()
            setIsLoading(false);
     

    }, []);`
Tags:

2

Answers


  1. 0

    You’ve left out the most important piece of code, the API where you talk with DynamoDB.

    It seems you are getting back a list of items, but you are trying to parse it as a single object.

    You should iterate the data array and set the values of each item within the array.

    Login or Signup to reply.
  2. 0

    You can try iteration with data.forEach

    useEffect(() => {
  const fetchCompanies = async () => {
    try {
      const restOperation = get({
        apiName: "adminbbatestApi",
        path: "/companies",
      });
      const { body } = await restOperation.response;
      const data: any = await body.json();
      console.log("GET call succeeded: ", data);
      let fetchDataArray: CompaniesModel[] = [];
      data.forEach((extractedData: any, index: number) => {
        const loadedCompanies: CompaniesModel = {
          entityId: extractedData.entityId,
          entityType: extractedData.entityType,
          parentCompany: extractedData.parentCompany,
          companyType: extractedData.companyType,
          status: extractedData.status,
        };
        fetchDataArray.push(loadedCompanies);
      });
      console.log("loadedCompanies", fetchDataArray);
      console.log("Loaded Compoany on Index 1", fetchDataArray[0]);
      setCompaniesList(fetchDataArray);
      setIsLoading(false);
    } catch (error) {
      console.log("GET call Failed", error);
    }
  };
  fetchCompanies();
  setIsLoading(false);
}, []);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search