CODEWITHSUNDEEP
reactjsreactjs-flux
doubleya
doubleya

Reputation: 539

reactjs flux send data from child component to parent

I'm running into a "doing it the right way" dilemma and could use some expertise. I have a parent component:

<Articles>

and inside of that component, I'm rendering a child component for each article:

<Article>

When an Article is clicked, I want to send an articleId to the parent <Articles> component. The <Articles> component is going to then dispatch whatever it needs to back to my ArticleStore to handle the data and emit back to my <Articles> component.

My question is, is it ok to pass my articleId directly to the parent, or since i'm using the Flux architecture, should I dispatch the articleId to the store, and then let the store emit the articleId back to the parent?

Upvotes: 0

Views: 336

Answers (1)

mjhm
mjhm

Reputation: 16695

To keep concerns separated the Article component should have no direct knowledge of it's parent. So the only way it should communicate back to the parent Articles is by way of a callback passed from Articles (e.g. articleIdChangeHandler). Then the callback can do whatever you want including setting articleIdas state in Articles or dispatching articleId to the store.

Generally you don't want to expose Flux actions in lower level components, so you probably don't want to directly dispatch from Article.

Whether to keep the single source of truth of articleId as state in Articles or in the Flux store is always an interesting question. More often than not I find that things like articleId need a more global scope than I initially thought, so it may start out as component state, but often ends up in the store after all.

Upvotes: 1

Related Questions