Wie die App-Schublade in Polymer-Starter-Kit erhalten

bearbeiten wechseln: Der Code hier https://github.com/PolymerElements/polymer-starter-kit ist (Ich lief Polymer init gemäß den Readme-Anweisungen)Wie die App-Schublade in Polymer-Starter-Kit erhalten

Wenn ich versuche,

<paper-icon-button icon="menu" drawer-toggle></paper-icon-button>

mit

Wie in den Dokumenten verschwindet die Schaltfläche. Wenn ich versuche,

<paper-icon-button icon="menu" paper-drawer-toggle></paper-icon-button>

Die Schaltfläche wird wieder angezeigt, funktioniert aber nicht.

Ich habe versucht, einige andere Beispiele wie onclick = drawer.toggle() im Tag zu folgen, aber ich weiß nicht, wie/wo Schublade zu definieren. Das gleiche gilt für den Versuch zu verwenden

document.querySelector('paper-icon-button').addEventListener('tap', function() { 
     drawer.toggle(); 
    });

Es ist ein lokales DOM, also muss ich irgendwie umgehen. Wenn ich var drawer = this. $$ ('app-drawer') oder dieses. $. 'App-drawer' oder eine andere Syntax, die ich kopieren und einfügen kann, benutze, bekomme ich nur Fehler. Ich bin eindeutig ein Neuling für Polymer, und nach gut 6 Stunden damit zu spielen, bin ich verloren und könnte ein wenig Anleitung brauchen.

Quelle

2016-11-25 Bobby Battista

können wir Ihren Code sehen. Damit wir wissen, wie/wo Sie es verwenden – a1626

Ich habe den Code hinzugefügt, danke für die Antwort! –

Sie sollten das Ereignis auf Tippen im Papier-Symbol-Taste erklären die Schublade zu handhaben:

<paper-icon-button icon="menu" on-tap="_toggleDrawer" aria-label="Menu"> </paper-icon-button>

dann in der App-Schublade Sie te Eigenschaft widerspiegeln sollte drawerOpened so kann sie es öffnen oder schließen :

<app-drawer opened="{{drawerOpened}}" swipe-open tabindex="0">

Und schließlich die _toggleDrawer Funktion wie folgt erklären de Wert der App-Schublade geöffnet Eigenschaft zu ändern:

_toggleDrawer: function() { 
    this.drawerOpened = !this.drawerOpened; 
    }

Hoffe, es hilft

Quelle

2016-11-25 14:04:09 JpCrow

Wenn Sie von hier lesen, "die Toggle-Funktion in Ihrem Skript ist nicht erforderlich, funktioniert der Toggle mit dem Papier-Fach-Toggle-Attribut auf dem Papier-Icon-Button-Element." Obwohl das Wort "Papier" aus dem Code in diesem Starter-Kit fehlt, sagt es nur "Schublade-Toggle" http://StackOverflow.com/Questions/30714253/Polymer-1-0-Paper-Drawer- panel-toggle-is-not-working –

Ich sehe auch hier, dass dieses Verhalten auf einem Laptop erwartet wird - dass der Schubladen-Toggle nur auf einem kleinen Display funktioniert. Aber mit ForceNarrow funktioniert auch nicht ... Wie kann ich diesen Knopf in der Entwicklung testen? https://github.com/PolymerElements/app-layout/issues/252 –

Es stellt sich heraus, dass die Schublade-toggle für große Bildschirme deaktiviert ist, so während der Entwicklung auf einem Laptop, die ganze Schaltfläche wird verschwinden. Um es zurück zu bekommen, müssen Sie im Tag "app-drawer-layout" force-engage verwenden. Es ist auch erwähnenswert, dass die Dokumentation keine Attribute auflistet, die Sie in den Tags verwenden können. Sie listet nur Eigenschaften auf ... Sie können Eigenschaften jedoch einfach in Attribute konvertieren, indem Sie von camelCase zu using-Bindestrichen wechseln. forceNarrow wird kraft-schmal. Ich habe dieses hier gefunden: https://github.com/PolymerElements/app-layout/issues/218

Quelle

2016-11-26 01:09:58

Wie die App-Schublade in Polymer-Starter-Kit erhalten

Antwort

Verwandte Themen