Задать вопрос
LisPNZ
@LisPNZ
Почти фулстек

Как обмануть реактивность Vue?

есть два больших массива (один порядка 4-5 тысяч объектов, второй может быть меньше).
Компонент строит таблицу с данными. Первый массив cells содержит как раз объекты описывающие вид ячеек.
Второй массив содержит объекты данных {id_ячейки:"sadasd asd asd a", value:"какой то текс или число"}.
Для отрисовки строк и столбцов я сделал computed свойство (многомерный массив на основе первого массива cells)
С первым массивом все более менее нормально, на основании него строится таблица и нормально отрисоввывается.
Проблема со вторым массивом values, он содержит данные которые нужно вставить в соответствующие ячейки.
Данные во первых получаются отдельным запросом и их нужно раскидать по соответствующим ячейкам, и еще они могут изменяться в процессе (отдельными запросами с сервера).
Здесь нужно отметить что ячейка является компонентом и элементы массивов передаются в нее как :cell и :value.
И если cell попадает туда через итерации for по строкам и столбцам computed многомерного массива, то value я перепробовал кучу способов передавать в ячейку. все они либо тормозные либо не вызывают реактивность и не перерисоввывают ячейку.
Грубо все способы можно разделить на те корорые используют реактивность массива values, либо ячейки запрашиваются через метод, что вызывает кучу ненужных вызовов метода.
Подскажите варианты решения данной проблемы. Идеи и варианты спустя две недели кончились.
  • Вопрос задан
  • 3233 просмотра
Подписаться 5 Простой 2 комментария
Решения вопроса 1
@ber_enot
Веб-разработчик, Vue.js / Node.js
Поставьте Vuex.
Данные для отображения храните в виде объекта:
values: {
1: value,
2: value
}

в компонент ячейки передавайте ключи этого объекта, а внутри компонента дергайте из vuex через computed свойство.
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
@iGanza
Пробуйте lazy render, virtual scroll как пример ленивого рендеринга
Ответ написан
Комментировать
@bagzon
Backend PHP, NodeJs, JS
Надеюсь не все 4-5к строк на клиент шлются?
По сути заюзай VUEX, все мутации (изменения данных) проводи через вьюкс, и так же получения данных через вьюкс.
И всё будет хорошо) Главное делать все маленькими порциями ну хотя бы по 100элементов на странице, чтобы клиент не тормозил.
Ответ написан
@yaBliznyk
Сделать пагинацию и отдельный массив отображения, где будет слайс текущей страницы элементов. Массив с данными сделать не реактивным.
Ответ написан
Комментировать
@Sundagy
BEADS
Handsontable
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы