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

props.children not working properly in react-anime.js? #36

Open
ruizj-ibm opened this issue Dec 9, 2017 · 2 comments
Open

props.children not working properly in react-anime.js? #36

ruizj-ibm opened this issue Dec 9, 2017 · 2 comments

Comments

@ruizj-ibm
Copy link

ruizj-ibm commented Dec 9, 2017

I am having an issue when the props.children change for an <Anime>.

To solve my issue, I made this change to function componentWillReceiveProps in react-anime.js file:

this.children = {
        /*
        cur: children.filter(function (c) {
          return difChildren.indexOf(c) < 0;
        }),
        */
        cur: children,
        prev: childrenWereRemoved ? difChildren : this.children.prev,
        next: !childrenWereRemoved ? difChildren : this.children.next
      };

For some reason, the filter was returning zero children, even though there was a child component.

I am using anime like this;

//inside parent component
<FadeIn>{messageWords}</FadeIn>

let FadeIn = props => {
    return (
        <Anime easing="linear"
            autoplay={true}
            duration={500}
            direction="normal"
            loop={false}
            opacity={[0, 1]}
            delay={(el, index) => ((index * 200) + 1500)}>
            {props.children}
        </Anime>
    )
}

@JordynMarcellus
Copy link

JordynMarcellus commented Feb 10, 2018

+1 on this -- discovered this while playing with react-anime today.

Thanks @ruizj-ibm for the fix, it seems to have solved my issue!

@jaylocke
Copy link

jaylocke commented Sep 9, 2018

+1 the same problem

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

No branches or pull requests

3 participants