Это моя первая попытка интегрировать React-Router4 в приложение React / Redux.Я застрял на первом препятствии в течение пары часов, когда я читаю документы и (очень хорошую) статью о CSS-хитростях.
Проблема в том, что не будет отображаться «что угодно»значение I вводится в компоненте prop, который должен быть компонентом.
На самом деле я почти полностью прочитал (превосходные) документы, начиная здесь: https://reacttraining.com/react-router/web/guides/quick-start
И я ознакомился с этой статьей: https://css -tricks.com/react-router-4/ Который также включает этот Codepen (чтобы увидеть, сделал ли я что-то очевидное / глупое): https://codepen.io/bradwestfall/project/editor/XWNWge?preview_height=50&open_file=src/app.js
Я просто надеюсь, что кто-то на SO мог быподтолкнуть меня через этот горб.Я ожидал, что, по крайней мере, смогу сделать это очень просто без каких-либо дополнительных библиотек или настроек для моих хранилищ на основе: https://reacttraining.com/react-router/web/guides/redux-integration
точка входа, index.js:
import React, { Component } from 'react'
import ReactDOM from 'react-dom'
import store from './stores'
import { Provider } from 'react-redux'
import Home from './components/Home'
import TopStories from './components/TopStories'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
// app entry point
const app = (
<Provider store={store.configure(null)}>
<Router>
<Switch>
<Route path="/" exact component={Home} />
<Route path="/topstories" component={TopStories} />
</Switch>
</Router>
</Provider>
)
// virtual DOM render
ReactDOM.render(app, document.getElementById('root'))
Компонент TopStories.js (отображается нормально в пути '/', если я переключаю его с Home)
import React, { Component } from 'react'
export default (props) => {
return(
<div>Top Stories component </div>
)
}