4 ms·

How does using Redux solve the tons of props through layers problem?

• acemarke 9y ago
  Because you can use the React-Redux `connect()` function to wrap any component in your tree with a "container component" that automatically subscribes to the Redux store, extracts the data you want for that component, and passes it straight in. That way, the upper components in your application don't need to know that a leaf component happens to need a specific value and pass it down through N levels of components - that one component just grabs the data it needs from the store. A good example of this would be a list or a treeview, where every list item or treeview node is itself connected to the store. I talked about some of the benefits of using Redux in a React application in a post I co-wrote: https://www.fullstackreact.com/articles/redux-with-mark-erikson/ https://www.fullstackreact.com/articles/redux-with-mark-erik...
  • zepolen 9y ago
    That sounds completely opposite to the React functional philosophy and is akin to using global variables in a regular program. Have fun testing that!
    • egeozcan 9y ago
      You can test the base component or test the connected component with a dummy state. If your state is shallow, this is very easy to do.
      • Jare 9y ago
        My second problem with Redux, besides the common one about boilerplate, is precisely the mismatch between the recommended, RDBMS-like shallow store, and the typically tree-like OO nature of both the UI and the application logic. I understand that concrete containers act as adapters between the store and a given level of the application/UI tree, but this "impedance mismatch" is a real drag.
    • mateuszf 9y ago
      It's actually trivial to test, because all of the state is known at any time. So yes - kinda global state, but exact full state as input and exact full state out as output. Which you can test sliced into parts with as many tests as you want.