an error whilst working with react app - Cannot read property 'photo' of undefined

Question

I created an app that is a clone of flickr. As the user type in the input box it should render the pictures associated with the search value. Unfortunately, when I type it tells me "Cannot read property 'photo' of undefined", but then it kinda works. I really would like this app to work without any bugs. Please see attached the codesandbox.

https://codesandbox.io/s/condescending-kare-oqxw5

const images = _(results).map(generateURL); this will solve your problem — Manish
– Manish, Commented Mar 3, 2020 at 7:59
@Manish hey Manish, thanks I will defo try it out! Do you know by any chance why if I type in my input and console log it always shows me a result with one character less? If I type money in my console.log will appear mone — paula
– paula, Commented Mar 3, 2020 at 8:06
You are passing this.state.query to the parent even before state.query is set to the actual value. setState sets the state at later point of time. so try calling this.props.onInput(event.target.value); — Arpitha Chandrashekara
– Arpitha Chandrashekara, Commented Mar 3, 2020 at 8:14
@ArpithaChandrashekara omg yes! thanks! I hope one day it will become a second nature for me :) — paula
– paula, Commented Mar 3, 2020 at 8:18

Pushprajsinh Chudasama · Accepted Answer · 2020-03-03 07:58:32Z

1

Make this function like this. First check weather photo is present.

jsonp(flickrURL, flickrParams, { callback: "jsoncallback" }).then(
   results => {
      console.log(results);
      if(results.photos){

        const images = _(results.photos.photo).map(generateURL);
        console.log(images);
        this.setState({ images: images });
      }
  }
);

answered Mar 3, 2020 at 7:58

Pushprajsinh Chudasama

7,9994 gold badges23 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

an error whilst working with react app - Cannot read property 'photo' of undefined

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related