ziondork
ziondork

Reputation: 169

Is it better to pass prop to child even if I can get it from redux inside child?

In my react application, lets say I have some data which is needed by both a parent component and its immediate child. The application uses redux for state management.

Now, in the child component, I can use useSelector and get the sate. But as I already have the information in the parent (in case it matters, I also got using useSelector), I simply pass props to the child like <Child info={someInfo} />. Here is Child is child component and someInfo is the sate information I got using useSelector.

My question is, should I pass props in this case or get the data using useSelector in child component. Moreover, will passing props be faster than instead of reading using useSelector and vice-versa?

Upvotes: 11

Views: 2674

Answers (2)

Andrej Kirejeŭ
Andrej Kirejeŭ

Reputation: 5481

Passing data through props makes the component a functional one or at least more functional. Such components are easier to maintain, test and reuse. It also makes it less dependent on future changes in the store structure. But, as it is often in our lives, there are no things as the only one right way. If your project contains many nested components, passing data all the way down through all layers would make code entangled and complicated.

In my practice, I always make UI components (lists, edits, grids, tables, etc.) as pure functional ones and use them inside business-logic-related components which are connected to store and perform side effects.

Upvotes: 7

zero298
zero298

Reputation: 26878

I think this is maybe a little opinion-based. Getting it from flux store means there is a hard coupling with store lib. If you pass in the prop, you can reuse the component in another, storeless, application. I've encountered this a lot with some of the components I've made and tend towards passing props in. But again, it can make sense in some cases where the component would never see reuse anyway.

Upvotes: 0

Related Questions