DEV Community

Discussion on: Pure Functions in React

View post
Collapse
 
ruslanmystore profile image
ruslan-mystore • • Edited

The big question/problem is how to use pure functions in a real-world, complex app.
Here is some small example:

  async function handleMenuItem(groupID: string) {
    await handleGetPosts(null, true, groupID)
    window.scrollTo({
      top: 0,
      behavior: 'smooth',
    })
  }
Enter fullscreen mode Exit fullscreen mode

After clicking a menu item, I need to scroll to top.
This function has a side effect.

What do you think, How to make this one to be a pure function/

Collapse
 
keevcodes profile image
Andrew McKeever •

With a React FE, most components should remain pure while leaving only a few components with the responsibility to handle state updates. React context or state management libraries make this concept easier to follow