AntonBrock
@AntonBrock
screen light

Как исправить баг. И почему только на телефоне?

Есть сайт на нем ( в статьях), просто кликнете на карточку, меняются статьи. Т.е. не полностью все подгружаются, а когда пользователь скролит.

Проблема в мобилке. Он просто ведет себя совсем по-другому. Он не подгружает по скроллу, а просто все статьи выгружает. В чем ошибка не могу найти. Проверить на localhoste не могу. в devtools на моб. нормальное поведение.

Вот код скролла, для большего понимания лучше зайти на сайт с телефона и нажать на любую карточку.

mounted() {
    this.scroll()
  },
  methods: {
    scrollToTop() {
      if (scrolled > 0) {
        window.scrollTo(0, scrolled)
        scrolled = scrolled - 100
        timer = setTimeout(() => {
          this.scrollToTop()
        }, 10)
      } else {
        clearTimeout(timer)
        window.scrollTo(0, 0)
      }
    },
    scroll() {
      /* eslint-disable */
      let iCan = false
      window.onscroll = () => {
        window.pageYOffset > 1 ? iCan = true : false
        const bottomOfWindow =
          document.documentElement.scrollTop + window.innerHeight >=
          document.documentElement.offsetHeight

        if (bottomOfWindow && iCan) {
          if (!this.loading) {
            this.loading = true
            // добавляем старую статью в слайдер
            this.$store.dispatch('addArticle')
            // при этом удаляем предыдущие

            if (this.$store.state.prev != null) {
              this.$store.dispatch('deleteArticles')
                .then(success => {
                  this.mySwiper.slideNext()
                })
            }
          }
          this.mySwiper.slideNext()
          setTimeout(() => {
            this.loading = false
          }, 1000)
        } else if (document.documentElement.scrollTop === 0 && iCan) {
          // добавляем новую статью в слайдер
          this.$store.dispatch('returnArticle')
          // при этом удаляем предыдущие
          if (this.$store.state.next != null) {
            this.$store.dispatch('deleteArticles')
              .then(success => {
                this.mySwiper.slidePrev()
              })
              /* eslint-enable */
          }
        }
      }
    },
    imgFor() {
      if (screen.width <= 500) {
        const img = document.getElementsByTagName('img')
        for (let i = 0; i <= img.length; i++) {
          img[i].style = 'max-width:280px'
        }
      } else return null
    }
  }


Большое спасибо!
  • Вопрос задан
  • 72 просмотра
Пригласить эксперта
Ответы на вопрос 1
@veremii
Подключайте мобилку к хрому через DevTools и дебажьте. https://webbeaver.ru/instructions/debugging-on-mobile/ вот тут есть инструкция.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы