Skip to content

Instantly share code, notes, and snippets.

@sobstel

sobstel/unmount_animation_example.js

Created March 8, 2021 09:57
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save sobstel/8b1b58dfe0b2f425d0850cb0f22a92c5 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save sobstel/8b1b58dfe0b2f425d0850cb0f22a92c5 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. sobstel created this gist Mar 8, 2021.
    19 changes: 19 additions & 0 deletions unmount_animation_example.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    // https://github.com/oblador/react-native-animatable/issues/132#issuecomment-786870602

    const MyComponent = (props) => {
    const ref = React.useRef();

    React.useEffect(() => {
    ref?.current?.fadeIn();

    return () => ref?.current?.fadeOut(); // as you know, this is the same as unmount ;)
    }, [props.id]); // track some prop that changes

    return (
    <Animatable.View ref={ref}>
    <View>
    ...stuff
    </View>
    </Animatable.View>
    );
    };