adrianhajdin / project_travel_advisor

Tutorial created in collaboration with Enyel Sequeira, taught by JavaScript Mastery.
MIT License
2.01k stars 444 forks source link

Scroll Into View #11

Open ghost opened 2 years ago

ghost commented 2 years ago

Hey, there Adrian! Don't know why is this happening

ScrollIntoView is not working

I`ve re-write the code couple of times by going back into the video where you start explaining CHILD CLICKED

CHILD CLICKED IS WORKING as shown in console.log

but after that when you explain if(selected) refProp?.current?.scrollIntoView({ behavior:'smooth', block:'start' })

everything runs except child click stops and the scroll does not work when clicked

gr8guyrabi commented 2 years ago

Replace your code to this where you're rendering your PlaceDetails component `

`

In the video, he deleted ref={elRefs[i]} but is required.

dhananjaybhandiwad commented 2 years ago

Guys i have done everything asked here and still my scroll doesnt work similar to @Shubham-Sakhare any help is appreciated.

gr8guyrabi commented 2 years ago

Guys i have done everything asked here and still my scroll doesnt work similar to @Shubham-Sakhare any help is appreciated.

did you try using the apporach above?

Rallanvila commented 2 years ago

bitmoji

Thanks @gr8guyrabi , that worked like a charm.

sanidhyy commented 2 years ago

Replace your code to this where you're rendering your PlaceDetails component <Grid ref={elRefs[i]} key={i} item xs={12}> <PlaceDetails selected={Number(childClicked) === i} refProp={elRefs[i]} place={place} /> </Grid>

In the video, he deleted ref={elRefs[i]} but is required.

Thanks Bro! works like a charm.

GeomaticaNet commented 1 year ago

Replace your code to this where you're rendering your PlaceDetails component <Grid ref={elRefs[i]} key={i} item xs={12}> <PlaceDetails selected={Number(childClicked) === i} refProp={elRefs[i]} place={place} /> </Grid>

In the video, he deleted ref={elRefs[i]} but is required.

Excelent! it works!!!!!

RISHABH2407 commented 1 year ago

Replace your code to this where you're rendering your PlaceDetails component <Grid ref={elRefs[i]} key={i} item xs={12}> <PlaceDetails selected={Number(childClicked) === i} refProp={elRefs[i]} place={place} /> </Grid>

In the video, he deleted ref={elRefs[i]} but is required.

It is working but not creating similar effect like that in video.

shivendra8004 commented 1 year ago

Thanks @gr8guyrabi . Lobe you💋