"Thinking in React": fix list formatting
Andrey Popp committed
Nov 6, 2013 at 03:50 UTC
20b7faaab75f72c1e92c46e001c3bbd51666aa84
1 file changed
+2
docs/_posts/2013-11-05-thinking-in-react.md
+2
@@ -108,12 +108,14 @@ OK, so we've identified what the minimal set of app state is. Next we need to id
108
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:
109
110
For each piece of state in your application:
111
+
112
* Identify every component that renders something based on that state.
113
* Find a common owner component (a single component above all the components that need the state in the hierarchy).
114
* Either the common owner or another component higher up in the hierarchy should own the state.
115
* 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.
116
117
Let's run through this strategy for our application:
118
+
119
* `ProductTable` needs to filter the product list based on state and `SearchBar` needs to display the search text and checked state.
120
* The common owner component is `FilterableProductTable`.
121
* It conceptually makes sense for the filter text and checked value to live in `FilterableProductTable`