0

When using the react-animation-components library, when I apply the Fade to any element it doesn't appear on the page. When I inspect the page the I notice that the elements are there but the Fade is causing the styling on the div to be: style:"transition: opacity 500ms ease 0ms; opacity: 0; will-change: opacity;"

Has anyone ever experienced this error. Is there a workaround using the same library?

I've tried adding opacity, but neither work.

I'm expecting for my elements to fade in appearance.

Here's the function:

function RenderLeaders({leaders}) {
return (
    <Stagger in>
        {leaders.map((leader) => ( 
        //<div key={leader.id} className="col-12 col-md-12 m-1">
            //<Fade in={true} enterOpacity={1}> <RenderLeader key={leader.id} leader={leader} /></Fade>
            <Fade in><RenderLeader key={leader.id} leader={leader} /></Fade>
        //</div>
         
        ))}
    </Stagger>
)
bigdg14
  • 11
  • 3

0 Answers0