Макет веб-приложения в зависимости от устройства - PullRequest
0 голосов
/ 10 октября 2018

Привет, я новичок в программировании и пытаюсь создать прогрессивное веб-приложение с Polymer3. Я хочу отображать веб-приложение с определенной компоновкой, когда открываю его на рабочем столе и хочу отображать Интернетприложение по-другому, когда я использую его в мобильном устройстве.Я не знаю, как я могу это сделать, может кто-нибудь отправить мне в правильном направлении, чтобы я мог разблокировать себя?

Любая помощь более чем ценится.

1 Ответ

0 голосов
/ 12 октября 2018

Если вам нужны два разных макета из-за типа устройства, здесь вам может помочь следующий код:

DEMO

    static get template() {return `
    <template is='dom-if' if='[[mobileDevice]]'>
     .... Mobile device Layout
    </template>
    <template is='dom-if' if='[[!mobileDevice]]'>
     .... Desktop device Layout
    </template>'

    ... 
    //
    ready(){
      super.ready()
      if( /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ) {
        // Mobile device
        this.set('mobileDevice', true);
      } else {
        // Desktop
        this.set('mobileDevice', false);
      }
   }
...