Grow-scroll — это изысканный компонент прокрутки, который поддерживает ПК и мобильные устройства. В настоящее время он поддерживает обновление потягиванием вверх и загрузку по пролистыванию вниз, карусель, адресную книгу. В будущем планируется добавить больше функций.

Адрес для предварительного просмотра

https://xiaohuan171.gitee.io/grow-scroll

Документация

https://gitee.com/xiaohuan171/grow-scroll/wikis/pages

Как использовать

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

Быстрый старт

См. простой пример.

Распространённые проблемы

Grow-scroll инициализирован, но не может прокручиваться.

Невозможность прокрутки — это явление, которое требует выяснения основной причины. Прежде чем это сделать, давайте сначала рассмотрим принцип работы полосы прокрутки браузера: Полоса прокрутки в браузере знакома всем. Когда высота содержимого страницы превышает высоту окна просмотра, появляется вертикальная полоса прокрутки; когда ширина содержимого страницы превышает ширину окна просмотра, появляется горизонтальная полоса прокрутки. То есть, когда содержимое не помещается в окне просмотра, пользователь может прокручивать экран, чтобы увидеть оставшееся содержимое.

Принцип работы grow-scroll такой же. Мы можем более наглядно представить его с помощью диаграммы:

Зелёная часть представляет собой обёртку, то есть родительский контейнер, который имеет фиксированную высоту. Жёлтая часть представляет собой контент, который является первым дочерним элементом родительского контейнера, и его высота будет увеличиваться по мере увеличения размера содержимого. Таким образом, если высота контента не превышает высоту родительского контейнера, прокрутка невозможна, а как только она превысит высоту родительского контейнера, мы сможем прокручивать область содержимого, что и является принципом работы grow-scroll.