Setup structure
Selectors: functions that get data from the state for you Actions: incoming state changes. Generally have payload (new data) and type (key used to route the action). Reducer: handling the actions. Generally large switch statements that route actions. Make sure by default you return the state even if there was no change, because the reducer is getting called whether or not it needs to so you could lose track of your state. Currently, the three branches of our state are metadata (basically all the data that is not visual content), content (visual content displayed on the site), and selections (active selections made by the user). To connect state to a component: use connect, which takes two arguments. The first is the function that returns a mapping of the particular element of the state you want to hand from the state to a property on the component, and the second is a property to give the component that will become a function wrapped in dispatch. Ie: {prop : fn} becomes dispatch(fn(prop)). In both cases, do not directly access the state nested objects (ie like state.selections.navTab), or directly call the dispatch function, instead pass functions that take care of the mapping for you.
1 Comment
|
Categories
All
|