與Redux和Router反應-不渲染組件

Question

我不明白為什么組件Sample根本無法渲染。 網址更改，控制台中沒有錯誤，但是未安裝組件。 無論是功能組件還是React類。 以及為什么正確顯示帶有URL“ / thisworks”的內聯組件。 我在這里做錯了什么？

index.jsx：

render(
    <Provider store={store}>
        <Root />
    </Provider>,
    document.getElementById("root")
);

root.js：

const Root = () => (
    <div>
        <BrowserRouter>
            <Switch>
// routes below work fine
                <Route path="/login" component={LoginPage} />
                <Route path="/" component={App} />
            </Switch>
        </BrowserRouter>
        <DevTools />
    </div>
)

App.js：

class App extends React.Component {
    render() {
        return (
            <div>
                <NavMenu />
                <Switch>
                    <Route path="/thisworks" render={(props) => {
                        return (<div>This works!</div>);
                    }} />
                    <Route path="/sample" Component={Sample} /> // not working - not rendering component Sample
                    <Redirect from="/" to="/sample" />
                </Switch>
            </div>
        );
    }
}

const mapStateToProps = (state, ownProps) => ({})    
const mapDispatchToProps = (dispatch) => ({})    
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(App))

Sample.jsx：

const Sample = (props) => {
    return (
        <div>
            Sample!
        </div>
    );
}
export default Sample;

Answer 1

也許component而不是Component ？

<Route path="/sample" component={Sample} />