使用react-router-dom的MemoryRouter时以编程方式导航

Question

使用MemoryRouter时如何导航到其他路线？ 以下代码不起作用，history.push('/settings')正在更改地址栏中的URL，而不是显示设置路线。

import React from 'react';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import ListItemText from '@material-ui/core/ListItemText';
import { MemoryRouter, Route, Switch, Link, useHistory } from 'react-router-dom';

function MenuItems() {

  const history = useHistory();

  return (
    <MemoryRouter>
      <Switch>
        <Route exact path="/settings">
          <List>
            <ListItem button>
              <ListItemText primary={'Accreditations'} />
            </ListItem>

            <ListItem button>
              <ListItemText primary={'Curriculums'} />
            </ListItem>
          </List>
        </Route>

        <Route path="/">
          <List>
            <ListItem button>
              <ListItemText primary={'Dashboard'} />
            </ListItem>
            <ListItem button>
              <ListItemText primary={'Users'} />
            </ListItem>
            <Link to="/settings">
              <ListItem button onClick={e => history.push('/settings')}>
                <ListItemText primary={'Settings'} />
              </ListItem>
            </Link>
          </List>
        </Route>
      </Switch>
    </MemoryRouter>
  );
}

export default MenuItems;