Reactjs 转到新页面而不是在<；中呈现组件；main/>；使用React路由器4

在单击“下一步材质ui”抽屉中的链接时，我正在努力渲染嵌套组件。以下是我的“我的家”组件的代码：

const Home = (props) => {
const { classes } = props;

return (
    <div className={classes.root}>
        <Drawer variant="permanent">
            <div className={classes.toolbar} />
                <List component="nav">
                    {options.map(option => {
                        return (
                            <ListItem
                                key={option}
                                component={Link} to={`/${slugify(option, {lower: true})}`}
                                button>
                                <ListItemText primary={option} />
                            </ListItem>)
                    })}
                </List>
        </Drawer>
        <main className={classes.content}>
            <div className={classes.toolbar} />
                <Switch>
                    <Route exact path='/forecast' component={ContainerA} />
                    <Route path='/audience' component={ContainerB} />
                    <Route path='/adaptive-forecasting' component={ContainerC} />
                </Switch>
        </main>
    </div>
    )
};

---

我要做的是尝试从

ListItemText

开始逐个删除组件，然后

ListItem

查看哪个组件正在抛出error@TomaszMularczyk我意识到我的错误。如果您仔细查看代码，我将在根级别渲染路由，而不嵌套它们。我将路径更改为“/home/forecast”等等。在

browser.js:49 Warning: Material-UI: the value provided `undefined` is invalid