Прокрутка внутри React Material Container не плавная - PullRequest
Новая
       11

Прокрутка внутри React Material Container не плавная

1 голос
/ 08 июля 2019

У меня есть компонент, отображающий несколько дочерних компонентов. Я запускаю приложение в мобильном браузере Chrome и Safari, а также в качестве PWA на iOS.

Когда я отрисовываю этот компонент в полноэкранном диалоговом окне с материалом, прокрутка получается плавной и быстрой, как и ожидалось.

Однако, когда я рендерил этот же компонент внутри компонента Container (см. Следующий код), прокрутка идет медленно и не плавно. Поведение точно такое же, как описано на странице API диалога (Прокрутка длинного контента раздел), но я не вижу аналогичного свойства (scroll = paper или body) в API компонента Container. Какие-нибудь мысли? Что я здесь не так делаю?

Объект Styles: 

const useStyles = makeStyles(theme => ({
  root: {
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center'
  },
content: {
    flexGrow: 1,
    height: '100vh',
    overflow: 'auto',
  },
  container: {
    paddingTop: theme.spacing(4),
    paddingBottom: theme.spacing(4),
    justifyContent: 'center',
    alignItems: 'center'
  }
}

и функция рендеринга компонента со странной проблемой прокрутки: 

<main className={classes.content}>
  <Container maxWidth="lg" className={classes.container}>
       <MyComponent/>
  </Container>
</main>

1 Ответ

0 голосов
/ 09 июля 2019

WebkitOverflowScrolling: 'touch' все-таки сделал работу.

...