處理React和material-ui中菜單項列表的點擊

Question

我在React中有一個菜單組件，它使用了材料-ui List組件，看起來像這樣：

handleMenuItemClick() {
    // go to route defined in the ListItem
}

class MenuList extends React.Component {
    render() {
        return (
            <div>
                <List
                    onClick={this.handleMenuItemClick}
                >
                    <ListItem button route="/dashboard">
                        <DashboardIcon /> <ListItemText primary="Dashboard" />
                    </ListItem>
                    <ListItem button route="/investments">
                        <InvestmentsIcon /> <ListItemText primary="My investments" />
                    </ListItem>
                </List>
            </div>
        );
    }
}

我想要做的是去不同的路由定義ListItem的route屬性。 我如何在React中執行此操作？

我不希望每個菜單項都有單獨的點擊處理程序。

Answer 1

import {Link} from 'react-router-dom'
                       <ListItem
                            component={Link}
                            to="/"
                            button >

從這里引用