Atef95's avatar

Why dom is not updating ?

Hi everyone,

I'm using an old vue version ( v2.5.17) combined with a laravel project

I'm fetching some data through an api and showing a loader throughout the process

I've a show flag variable to toggle the loader

The issue is in some point the response gets returned , show set to false but loader keeps showing..

Code

<template>
  <div class="container">
 <vue-element-loading :active="show" is-full-screen />
    <h3 class="text-center token-text"><span class="text-accent"></span></h3>
 </div>
</template>

Api call

  loadMonitors() {
      this.show = true;
      //split type to get pagination

      let lengthType = this.setPaginationParams();
      if (lengthType == 0) {
        this.monitors = {};
        this.arrayPagination = [];
          this.show = false
        return;
      }
  

      axios
        .get(
          `${this.baseUrl}/integrations/${this.integration_id}/feeds?page=${
            this.paginationNumber
          }&records=${this.records}&type=${this.type}&sortAscending=${
            this.sort == "ASC" ? true : false
          }&searchString=${this.search}`
        )
        .then((response) => {
          // handle success

          this.monitors = response.data.data;
          this.totalPaginationNumber = response.data.data.lastPage - 1;
          this.lastPage = response.data.data.lastPage;

          this.createPagination();
          if (this.selectAll) {
            this.selectAllMonitors();
          }
        this.show = false;
      
        })
        .catch( (error) => {
          // handle error
          console.log(error);
             this.show = false;
        })
    
    },

Why that happens ?

0 likes
1 reply
Neo555's avatar

if you are getting response then I think you need to check CreatPagination() and selectAllMonitors()

Please or to participate in this conversation.