Vuetify Data Table перейти на страницу с выбранным элементом

Question

Используя таблицы данных Vuetify, я пытаюсь выяснить, есть ли способ определить, на какой странице находится текущий выбранный элемент, а затем перейти к этой странице.Мой пример использования для этого, я вытаскиваю данные из маршрута, чтобы определить, какой элемент был выбран в таблице данных, поэтому, когда пользователь следует по этому URL или обновляет страницу, тот же элемент автоматически выбирается для них.Это работает очень хорошо, однако я не могу понять, как заставить Таблицу данных отображать правильную страницу выбора.

Например, пользователь посещает mysite.com/11 Таблица данных показывает 10пункты на странице.Когда пользователь заходит на сайт, элемент № 11 в настоящее время выбирается автоматически, но он находится на 2-й странице элементов.Как я могу получить это, чтобы показать элементы 11-20 при загрузке страницы?

Answer 1

Я закончил тем, что использовал решение, подобное тому, что опубликовал @ExcessJudgement.Спасибо, что соединили эту кодовую ручку, кстати!Я создал эту функцию:

jumpToSelection: function(){
    this.$nextTick(() => {
      let selected = this.selected[0];
      let page = Math.ceil((this.products.indexOf(selected) + 1) / this.pagination.rowsPerPage);
      this.pagination.sortBy = "id";
      this.$nextTick(() => {
        this.pagination.page = page;
      });
    });
  }

Я не уверен, почему мне нужно было поместить это в $ nextTick (), но иначе это не сработало бы.Если у кого-то есть понимание этого, было бы полезно узнать, почему это так.

Второй $ nextTick () был необходим, поскольку при обновлении sortBy страница не вызывала обновления страницы, и, поскольку я нахожу страницу на основе идентификатора, мне нужно убедиться, что она отсортированаправильно, прежде чем прыгать страницы.Немного запутанный, но он работает.