Блог

Я разрабатываю приложение для ПК, планшетов и мобильных устройств, которое состоит из списка элементов. У каждого элемента есть страница сведений. Идея состоит в том, чтобы отображать страницу сведений о каждом элементе, когда пользователь нажимает на этот конкретный элемент, но с различным поведением в зависимости от устройства. На ПК / планшете подробное представление будет отображаться в правой части списка, а на мобильном устройстве страница сведений откроется на новой странице. Вы можете увидеть идею на этом изображении:

Изображение было сделано Мартином Притчардом, который несколько лет назад написал этот средний пост о том, как решить ту же проблему, с которой я сталкиваюсь сейчас. Он использовал IonSplitPane в Ionic 3 с Angular. Боюсь, я не могу использовать этот подход или, по крайней мере, я не могу воспроизвести его с помощью Vue.

Я пробовал IonSplitPane вместе с IonMenu, но поведение не является ожидаемым, потому что мне не нужно меню «гамбургер», которое сворачивается в режиме мобильного просмотра. Кроме того, я пробовал использовать только IonSplitPane, и я не могу поместить складную сторону в конец (как и должно быть, детальный вид, который скрывается на мобильном устройстве, а не на левой (главной) панели). Я даже не уверен, что это может быть решением, так как мне нужно, чтобы на мобильных устройствах страница сведений отображалась в новом представлении.

Кто-нибудь сталкивался с этой проблемой и мог бы мне помочь?

Заранее большое вам спасибо.