CODEWITHSUNDEEP
reactjs
BennKingy
BennKingy

Reputation: 1593

How to stop a functional component being rerenderd react

I have a functional component that is being rerenderd, and because it has a css animation in it, the animation starts from the beginning causing weird visual issues.

Any ideas how to fix this?

Upvotes: 0

Views: 81

Answers (2)

BennKingy
BennKingy

Reputation: 1593

I exported the scrollaction wrapped with memo and that worked for me :)

export default memo(ScrollAction);

Upvotes: 0

Cesare Polonara
Cesare Polonara

Reputation: 3860

You can wrap it in React.memo() wrapper. As long as it does not receive new props during a re-render, it's not going to re-render.

// You use the wrapper like this:
const ScrollAction = React.memo((props) => {
// Your ScrollAction Component
})

Upvotes: 2

Related Questions