Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Task: check useAnimatedProps parity with v1

See original GitHub issue

Description

From what I can see there are a few issues here, but basically I haven’t been able to get useAnimatedProps to work in any usecase.

Replication

https://github.com/kyle-ssg/reanimated2-experiments/blob/master/App/components/AnimatedOnOffImage.tsx

Given a simple example there’s perhaps maybe a clue of What’s happening, when the image source uri property is adjusted from the previous I see.

Then also given the following code:

https://github.com/kyle-ssg/reanimated2-experiments/blob/master/App/components/AnimatedBlur.tsx#L43

Package versions

    "react": "16.13.1",
    "react-native": "0.63.1",
    "react-native-reanimated": "2.0.0-alpha.5",

Issue Analytics

State:
Created 3 years ago
Comments:23 (11 by maintainers)

Top GitHub Comments

1reaction

kyle-ssgcommented, Jun 7, 2021

Maybe this

const [imageUri, setImageUri] = useState('https://via.placeholder.com/350x150'); // assuming its initial value is >= 0.5
useAnimatedReaction(
  () => {
    return animatedValue.value  >= 0.5 ? 'https://via.placeholder.com/350x150' : 'https://via.placeholder.com/100x100'
  }, (result,previous) => {
   if(result!==previous) {
    runOnJS(setImageUri)(result);
    }
  }
);

1reaction

kyle-ssgcommented, Jun 7, 2021

I think the issue is quite low level and may be down to the React Native side, might be worth creating a new issue for maintainers here to look at.