Skip to content

Commit

Permalink
"Thinking in React": fix list formatting
Browse files Browse the repository at this point in the history
  • Loading branch information
andreypopp committed Nov 5, 2013
1 parent 5dad5e9 commit 20b7faa
Showing 1 changed file with 2 additions and 0 deletions.
2 changes: 2 additions & 0 deletions docs/_posts/2013-11-05-thinking-in-react.md
Original file line number Diff line number Diff line change
Expand Up @@ -108,12 +108,14 @@ OK, so we've identified what the minimal set of app state is. Next we need to id
Remember: React is all about one-way data flow down the component hierarchy. It may not be immediately clear which component should own what state. **This is often the most challenging part for newcomers to understand,** so follow these steps to figure it out:

For each piece of state in your application:

* Identify every component that renders something based on that state.
* Find a common owner component (a single component above all the components that need the state in the hierarchy).
* Either the common owner or another component higher up in the hierarchy should own the state.
* If you can't find a component where it makes sense to own the state, create a new component simply for holding the state and add it somewhere in the hierarchy above the common owner component.

Let's run through this strategy for our application:

* `ProductTable` needs to filter the product list based on state and `SearchBar` needs to display the search text and checked state.
* The common owner component is `FilterableProductTable`.
* It conceptually makes sense for the filter text and checked value to live in `FilterableProductTable`
Expand Down

0 comments on commit 20b7faa

Please sign in to comment.