Why doesn't data work in nuxt?

Question

Vue.js

The slider does not work here, namely when I do a swipe, it says: Uncaught TypeError: Cannot read properties of undefined (reading 'length') to this.data.length. Thanks

Here is my code:

async asyncData({$axios}) {
    // eslint-disable-next-line camelcase
    const promiseGetProduct = await $axios.$get(`https://quiet-basin-404555.herokuapp.com/files/gallery-photos`)

    return {
      data: promiseGetProduct
    }
  },
  data() {
    return {
      id: this.$route.params.id,
      isActive: false,
    }
  },
  mounted() {
    const images = document.querySelector('.images')
    const gallery = document.querySelector('.gallery')
    const images2 = document.querySelector('.images2')

    console.log(this.data.length)

    const id2 = this.id - 1

    if (window.innerWidth < 768 && this.data[this.$route.params.id - 1].image.width < 600) {
      this.isActive = false
      images.classList.add('moreInfo')
    } else {
      this.isActive = true
    }

    if (this.data[id2].image.width > 1200) {
      gallery.classList.add('gallery-class-one-element')
      images.remove()
    } else {
      gallery.classList.add('gallery-class-two-element')
      images2.remove()
    }


    // SWIPE
    setTimeout(() => {
      document.addEventListener('touchstart', handleTouchStart, false);
      document.addEventListener('touchmove', handleTouchMove, false);

      let xDown = null;
      let yDown = null;

      //
      function handleTouchStart(evt) {
        xDown = evt.touches[0].clientX;
        yDown = evt.touches[0].clientY;
      }

      //
      function handleTouchMove(evt) {
        if (!xDown || !yDown) {
          return;
        }

        const xUp = evt.touches[0].clientX;
        const yUp = evt.touches[0].clientY;

        const xDiff = xDown - xUp;
        const yDiff = yDown - yUp;

        if (Math.abs(xDiff) > Math.abs(yDiff)) {
          if (xDiff > 0) {
            if (this.data.length !== parseInt(this.$route.params.id, 10)) {
              const id = parseInt(this.$route.params.id, 10) + 1
              this.$router.push(`/gallery-page/${id}`)
              // setTimeout(() => {
              //   location.reload()
              // }, 600)
            }
          } else if (parseInt(this.$route.params.id, 10) !== 1) {
            const id = parseInt(this.$route.params.id, 10) - 1
            this.$router.push(`/gallery-page/${id}`)
            // setTimeout(() => {
            //   location.reload()
            // }, 600)
          }
        }

        xDown = null;
        yDown = null;
      }
    }, 2500)

  },