Как передать состояние компоненту?

Question

Я новичок в редукции и реагирующем маршрутизаторе. В компоненте Product я могу получить доступ к productId, но как получить доступ к хранилищу? Или как передать продукт компоненту?

Редуктор

const reducer = combineReducers({ 
    products: (state = []) => state, 
    routing: routerReducer 
}); 

const store = createStore(
    reducer, { 
    products: [{ 
     id: 1, 
     name: 'Product A', 
     price: 1000 
    }, { 
     id: 2, 
     name: 'Product B', 
     price: 2000 
    }] 
    } 
); 

Компоненты

const Product = ({params}) => (
    <div> 
    Id: {params.productId} 
    </div> 
); 

class Products extends React.Component { 
    render() { 
    return (
     <div> 
     <h1>Products</h1> 
     <ul> 
      {this.props.children || 
      this.props.products.map(product => (
       <li key={product.id}> 
       <Link to={`/products/${product.id}`} >{product.name}</Link> 
       </li>))} 
     </ul> 
     </div> 
    ); 
    } 
} 

const mapStateToProps = (state) => { 
    return { 
    products: state.products 
    } 
}; 

const ProductsContainer = connect(
    mapStateToProps 
)(Products) 

Маршруты:

ReactDOM.render(
    <Provider store={store}> 
    { /* Tell the Router to use our enhanced history */ } 
    <Router history={history}> 
     <Route path="/" component={App}> 
     <IndexRoute component={Home}/> 
     <Route path="products" component={ProductsContainer}> 
      <Route path=":productId" component={Product}/> 
     </Route> 
     </Route> 
    </Router> 
    </Provider>, 
    document.getElementById('root') 
); 

Answer 1

продукт представляет собой контейнер. Потому что вы положили его на маршрут. Таким образом, вы должны использовать функцию connect и mapStateToProps для передачи хранилища, как и то, что вы делаете в контейнере Products.