flipping card does not work

[DeBao Chua]

Hello Syncfusion expert,

I follow the instruction on how to flip the card - https://ej2.syncfusion.com/javascript/demos/#/fabric/card/flip.html -- I am baffled because it works.

But I don't know why my side does not show any animation on card flipping. Do I miss anything?

I am using React Typescript.

Link:

https://stackblitz.com/edit/react-ts-ca4vsn?file=cards.tsx

Thanks expert

[Deepa Loganathan]

Hi DeBao Chua,   

  

Thanks for contacting Syncfusion support.    

  

We checked with the reported query and you have used rendereComplete to toggle “e-flipped” class. Instead, we suggest usingcomponentDidMount to update the animation classes since it the componentDidMount phase that gets triggered upon initial rendering of React Component.   

   

We have updated sample as shown in the below code snippet.    

Cards.tsx   

  

   

export class Cards extends React.Component<{}, {}> {   

    componentDidMount() {   // Use componentDidMount   

        …………   

    }   

}   

   

For your reference, we have updated the sample based on provided solution.    

https://stackblitz.com/edit/react-ts-pm5czo?file=cards.tsx   

   

Please let us know if you have any further queries.    

   

Regards,    

Deepa L.  

[DeBao Chua]

Hi Deepa,

Oh yes I forgot about componentDidMount method so I understand it. I have tested it and it is working well.

Thank you expert.

[Deepa Loganathan]

Hi DeBao Chua,    

 Most welcome. Please let us know if you have any further queries. 

Regards,  

Deepa L.