Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Warning : Calling 'getNode()' on the ref an Animated Component is no longer necessary. #672

Closed
5 tasks done
dilinade opened this issue Mar 29, 2020 · 45 comments
Closed
5 tasks done

Comments

@dilinade
Copy link

Is this a bug report, a feature request, or a question?

Question

Have you followed the required steps before opening a bug report?

(Check the step you've followed - put an x character between the square brackets ([]).)

Have you made sure that it wasn't a React Native bug?

It is a warning regarding deprecation of the method getNode().

Is the bug specific to iOS or Android? Or can it be reproduced on both platforms?

(Write your answer here and specify the iOS/Android versions on which you've been able to reproduce the issue.)

Is the bug reproductible in a production environment (not a debug one)?

Yes.

Environment

React native: 0.62.0
react-native-snap-carousel: 3.8.4

Target Platform:
Android (9.0)
iOS (13.3)

Expected Behavior

No warning should be raised. Upgrade is needed.

Actual Behavior

Raise of a warning.
image

Reproducible Demo

(Paste the link to a Snack example in which the issue can be reproduced. Please follow the guidelines for providing a Minimal, Complete, and Verifiable example.)

Steps to Reproduce

@ahsan-khan1999
Copy link

having same issue react-native v 0.61 occurs implementing nested navigation.

@lumberman
Copy link

@dilinade
Copy link
Author

dilinade commented Apr 5, 2020

@lumberman Give #673 a try :)

@AntonisMalakas
Copy link

same problem but im using the 'react-native-image-slider-box' which is using the carousel.

@binar1
Copy link

binar1 commented Apr 9, 2020

i fixed ,in this way,
go to nodeModule -> react-native-snap-carousel -> src -> Carousel.js
modify

const AnimatedFlatList = FlatList ? Animated.createAnimatedComponent(FlatList) : null;
const AnimatedScrollView = Animated.Animated.createAnimatedComponent(ScrollView);

to
const AnimatedFlatList = FlatList ? Animated.FlatList : null;
const AnimatedScrollView = Animated.ScrollView;

after find function _getWrappedRef
modify like this
_getWrappedRef () {
// facebook/react-native#10635
// https://stackoverflow.com/a/48786374/8412141
return this._carouselRef
}

then save it .
I Hope This can Help you

@anisharya16
Copy link

i fixed ,in this way,
go to nodeModule -> react-native-snap-carousel -> src -> Carousel.js
modify

const AnimatedFlatList = FlatList ? Animated.createAnimatedComponent(FlatList) : null;
const AnimatedScrollView = Animated.Animated.createAnimatedComponent(ScrollView);

to
const AnimatedFlatList = FlatList ? Animated.FlatList : null;
const AnimatedScrollView = Animated.ScrollView;

after find function _getWrappedRef
modify like this
_getWrappedRef () {
// facebook/react-native#10635
// https://stackoverflow.com/a/48786374/8412141
return this._carouselRef
}

then save it .
I Hope This can Help you

Thankyou so much, It helped.

@akhan118
Copy link

Hi, any updates on when this will be release ?

@ltcaosj
Copy link

ltcaosj commented Apr 25, 2020

I am looking for the release too :)

@keiscool2468
Copy link

waiting for the release

@Yashah301
Copy link

waiting for release too

@fdelavra
Copy link

waiting for release too ;)

@heesienooi
Copy link

+1 waiting for the release

@devmartinez0
Copy link

waiting for release too!

1 similar comment
@bpdarlyn
Copy link

bpdarlyn commented May 3, 2020

waiting for release too!

@xAgustin93
Copy link

¿Cuando se arreglara ese problema en el repositorio?

@didikk
Copy link

didikk commented May 4, 2020

I am looking for the release too

@tinchev
Copy link

tinchev commented May 4, 2020

+1

1 similar comment
@martinfrouin
Copy link

+1

@diegovfeder
Copy link

Would love to see this 'acclaimed' release

@AJV2018
Copy link

AJV2018 commented May 6, 2020

Waiting....

@harmandeepsingh
Copy link

Yes waiting...

@philipeneves
Copy link

Waiting

@loverdeveloper
Copy link

Yes waiting...

@renishg
Copy link

renishg commented May 9, 2020

Waiting for this release too

@ghasemikasra39
Copy link

waiting

@riamon-v
Copy link

waiting too..

@gegham-khachatryan
Copy link

waiting

@chahinaghrim
Copy link

waiting ..

@hussainhspl
Copy link

waiting

@ovy9086
Copy link

ovy9086 commented May 13, 2020

I don't know how all you guys commenting "waiting" here think this will solve the problem. maybe stop polluting the thread with useless comments, and a 👍 should be enough.
I think it's clear enough until now that a lot of people are 'waiting' for this fix.

@pratyaksh123
Copy link

pratyaksh123 commented May 18, 2020

Why the PR is not merged yet? It is really annoying working with those warnings

@MrLoh
Copy link

MrLoh commented May 18, 2020

Probably because it is really complicated to detect the RN package Version the right way.

@BhullarGagan
Copy link

i fixed ,in this way,
go to nodeModule -> react-native-snap-carousel -> src -> Carousel.js
modify

const AnimatedFlatList = FlatList ? Animated.createAnimatedComponent(FlatList) : null;
const AnimatedScrollView = Animated.Animated.createAnimatedComponent(ScrollView);

to
const AnimatedFlatList = FlatList ? Animated.FlatList : null;
const AnimatedScrollView = Animated.ScrollView;

after find function _getWrappedRef
modify like this
_getWrappedRef () {
// facebook/react-native#10635
// https://stackoverflow.com/a/48786374/8412141
return this._carouselRef
}

then save it .
I Hope This can Help you

Thanks, This is also working with react-native-image-slider-box.... Thanks for help

hemith added a commit to hemith/react-native-snap-carousel that referenced this issue May 21, 2020
@MrLoh
Copy link

MrLoh commented May 22, 2020

Chill out and wait a little guys. It’s been 10 days not 10 months since the PR was filed and theres an ongoing discussion about the implementation. Either contribute or be patient. Open source doesn’t work by stressing contributors out but by contributing and being grateful for the contributions of others.

@bd-arc
Copy link
Contributor

bd-arc commented May 26, 2020

Well, the main issue is that the suggested implementation is not backward compatible, meaning the plugin will break on every version of React Native but 0.62+.

This is a no-go for us, so unless someone comes up with a backward-compatible solution, we just can't merge this. (Take a look at #673 if you want to follow the discussion.)

Basically, what we need is a surefire way to identify whether getNode() needs to be called or not.

What we've tried so far:

  1. Detecting RN's version by checking the project's package.json file
  • ✅ Solves the issue.
  • ❌ Breaks the plugin when used with Expo.
  • ❌ Seems hacky at best.
  1. Checking for setNativeProps
  • ❌ Not reliable and breaks the plugin on everything but RN 0.62.

Running out of ideas here, so if you have a reliable solution, don't be shy and share it with us :-)

@bd-arc
Copy link
Contributor

bd-arc commented May 26, 2020

Ok, looks like this is going to be fixed pretty soon!

@bd-arc
Copy link
Contributor

bd-arc commented May 27, 2020

Fixed in versions 3.9.1 and 4.0.0-beta.4 with backward-compatible code.

@bd-arc bd-arc closed this as completed May 27, 2020
@HarshitMadhav
Copy link

Hi! I reached out this thread when I faced this 'getNode()' warning and I was using v3.9.0 and when I upgraded to v3.9.1 it still shows the 'getNode()' warning.

    _getWrappedRef () {
        if (this._carouselRef && (
            (this._needsScrollView() && this._carouselRef.scrollTo) ||
            (!this._needsScrollView() && this._carouselRef.scrollToOffset)
        )) {
            return this._carouselRef;
        }
        // https://github.com/facebook/react-native/issues/10635
        // https://stackoverflow.com/a/48786374/8412141
        return this._carouselRef && this._carouselRef.getNode && this._carouselRef.getNode();
    }

I am running on react-native v 0.62.2

@HarshitMadhav
Copy link

In updated version I changed this

const AnimatedFlatList = FlatList ? Animated.createAnimatedComponent(FlatList) : null;
const AnimatedScrollView = Animated.Animated.createAnimatedComponent(ScrollView);

to this:

const AnimatedFlatList = FlatList ? Animated.FlatList : null;
const AnimatedScrollView = Animated.ScrollView;

as mentioned by @binar1 above

I think any how this change did not get pushed into the update.

@AleksandrChyzhkov
Copy link

In the 3.9.1 release, the error did not disappear, so I used the @HarshitMadhav advice and with the help of patch-package fixed the problem so as not to wait for a new release. Thanks @HarshitMadhav !

@mikebertiean
Copy link

I can confirm that this warning has not been resolved

@vgm8
Copy link

vgm8 commented Mar 3, 2021

Tested this on react-native 0.63.4 and react-native-snap-carousel 3.9.1 and it is still happening

@PrsRares
Copy link

still happening. 0.63.3 and react-native-snap-carousel 3.9.1

@sjonchhe
Copy link

Chill out and wait a little guys. It’s been 10 days not 10 months since the PR was filed and theres an ongoing discussion about the implementation. Either contribute or be patient. Open source doesn’t work by stressing contributors out but by contributing and being grateful for the contributions of others.

Well now its been more than 10 months and problem still exists...

@jaehyunjung83
Copy link

i fixed ,in this way, go to nodeModule -> react-native-snap-carousel -> src -> Carousel.js modify

const AnimatedFlatList = FlatList ? Animated.createAnimatedComponent(FlatList) : null; const AnimatedScrollView = Animated.Animated.createAnimatedComponent(ScrollView);

to const AnimatedFlatList = FlatList ? Animated.FlatList : null; const AnimatedScrollView = Animated.ScrollView;

after find function _getWrappedRef modify like this _getWrappedRef () { // facebook/react-native#10635 // https://stackoverflow.com/a/48786374/8412141 return this._carouselRef }

then save it . I Hope This can Help you

this will help!!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.