Блог

У меня есть компонент Vue: task.vue который генерирует список задач, и epic.vue компонент, который является родительским task.vue , поэтому для каждого epic.vue я генерирую список задач task.vue . Проблема в том, что когда я перезагружаю страницу, браузер зависает на 4-5 секунд, пока task.vue компонент не отобразится полностью.

Каждый раз, когда я перезагружаю страницу, у меня есть ajax, который извлекает все данные из функции api. Он возвращает вложенный массив, содержащий epics (папки в папках), каждый со своим собственным набором задач. Это действительно большой массив, может содержать более 1000 записей.

Есть ли способ исправить зависание браузера во время task.vue загрузки компонента?

В моем epic.vue я просто передаю prop task.vue компоненту, содержащему все задачи, которые есть у текущего epic.

Моя структура массива и рендеринг vue выглядят точно так же: https://vuejs.org/examples/tree-view.html .

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