Создавать loading в компоненте vue-xlsx-table

Друзья, я intantando создавать один loading..., проблема состоит, в том, что использовав книжный магазин vue-xlsx-table, метод почти закрытый, так как ты только можешь соглашаться как только файл зазнался и обработал полностью.




Кто-то использовал заблаговременно этот книжный магазин, чтобы конвертировать форматы xlsx (excel) в JSON?

1
задан 27.03.2019, 17:56
1 ответ

Кажись что не estГЎn поддерживая cГіdigo с больше 2 aГ±os, но ты можешь решать проблему 2 форм, первой и более "незаконно вторгшейся" состоит та в том, чтобы приносить Ваш компонент и в том, чтобы это изменять и вторая - с компонентом asГ-ncrono . Вторая opciГіn serГ - во что-то asГ-:

const AsyncComponent = () => ({
  // The component to load (should be a Promise)
  component: import('./MyComponent.vue'),
  // A component to use while the async component is loading
  loading: LoadingComponent,
  // A component to use if the load fails
  error: ErrorComponent,
  // Delay before showing the loading component. Default: 200ms.
  delay: 200,
  // The error component will be displayed if a timeout is
  // provided and exceeded. Default: Infinity.
  timeout: 3000
})

Для того, чтобы ты увидел одну soluciГіn осуществленная, я создал sandbox с первой opciГіn:

VerГЎs, что есть папка с импортируемым компонентом vue-xlsx-table . Внутри я изменил vue-xlsx-table.vue для того, чтобы была переменная loading у , и управлять о Вашем состоянии в сдержись:

<!--  Añado la variable loading para gestionar cuando está cargando -->
    <button type="button" class="xlsx-button" @click="handleUploadBtnClick" :disabled="loading">
      <span v-if="loading">Loading</span>
      <span v-if="!loading">
        <slot></slot>
      </span>
    </button>

и в mГ©todo управления файла:

handleFileChange(e) {
  console.log("handling");
  if (this.rawFile !== null) {
    return;
  }
  this.loading = true;// incializo loading 
  this.rawFile = e.target.files[0];
  this.fileConvertToWorkbook(this.rawFile)
    .then(workbook => {
      let xlsxArr = XLSX.utils.sheet_to_json(
        workbook.Sheets[workbook.SheetNames[0]]
      );
      this.workbook = workbook;
      this.initTable(this.xlsxArrToTableArr(xlsxArr));
    })
    .catch(err => {
      console.error(err);
    })
    .finally(fin => { // finally para reiniciar loading 
      console.log("end");
      this.loading = false;
    });
},
1
ответ дан 02.12.2019, 05:22
  • 1
    Функционируй чуда, спасибо уважаемое Франсиско. – Marz 28.03.2019, 22:20
  • 2
    Гениальный! Я радуюсь тому, что он подал тебя. – Francisco Tena 29.03.2019, 00:23