как заставить навигацию по списку в материале реагировать - PullRequest
Новая
       6

как заставить навигацию по списку в материале реагировать

0 голосов
/ 04 сентября 2018

Мне нужна навигация типа https://material -ui.com / Getting-Start / Installation / и такая же структура ul> li> a> sapn, как у веб-сайта UI материала, созданного в его боковой навигации. и я тоже хочу такой же эффект.

Я использовал много хитростей, но перезапуск не удался. Пожалуйста, помогите

вот мой код 

<Router>
    <div>
        <List>
            {[0, 1, 2, 3].map(value => (
                <ListItem key={value}  className={classes.listItem}>
                    <Link button to="/about">
                        <ListItemText primary={`Line item ${value + 1}`} />
                    </Link>
                </ListItem>
            ))}
        </List>
    </div>
</Router>

1 Ответ

0 голосов
/ 04 сентября 2018

Вот код, который я использовал для боковой панели: 

    <Drawer
      variant="permanent"
      open
       >
      <div className={classes.toolbar}>
        <IconButton onClick={this.props.handleDrawerClose}>
          {theme.direction === 'rtl' ? <ChevronRightIcon /> : <ChevronLeftIcon />}
        </IconButton>
      </div>

      <Divider />

      <MenuList>
        {routes.map((prop, key) => {
          if (prop.redirect) return null;
          return (
            <Link to={prop.path} style={{ textDecoration: 'none' }} key={key}>
              <MenuItem selected={this.activeRoute(prop.path)}>
                <ListItemIcon>
                  <prop.icon />
                </ListItemIcon>
                <ListItemText primary={prop.sidebarName} />
              </MenuItem>
            </Link>
          );
        })}
      </MenuList>
    </Drawer>

пожалуйста, найдите, что Link окружает весь ManuItem, а стиль оформления текста - нет.

рабочие примеры с материала сайта: https://codesandbox.io/s/z6yooxokyl

...