2017-08-04 12 views
0

ツールバーの左上にあるメニューボタンをクリックしてpaper-drawerを切り替えたいとします。ポリマー2.0でエラーを定義する関数

"ReferenceError: _toggle is not defined at HTMLElement.onclick (http://null.jsbin.com/runner:1:1805)"

Here is the JSBin Demo:問題は、私は、コンソールに次のエラーを取得することです。

http://jsbin.com/degifisici/1/edit?html,console,output
<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>JS Bin</title> 

    <base href="http://polygit.org/polymer+:master/components/"> 
    <script src="webcomponentsjs/webcomponents-lite.js"></script> 
    <link rel="import" href="polymer/polymer-element.html"> 
    <link rel="import" href="app-layout/app-layout.html"> 
    <link rel="import" href="iron-icons/iron-icons.html"> 
    <link rel="import" href="iron-icon/iron-icon.html"> 
    <link rel="import" href="paper-item/paper-icon-item.html"> 
    <link rel="import" href="paper-icon-button/paper-icon-button.html"> 

</head> 
<body> 
    <dom-module id="my-el"> 
    <template> 
     <app-header reveals> 
     <app-toolbar> 
      <paper-icon-button icon="menu" onclick="_toggle"></paper-icon-button> 
      <div main-title>My app</div> 
      <paper-icon-button icon="delete"></paper-icon-button> 
      <paper-icon-button icon="search"></paper-icon-button> 
      <paper-icon-button icon="close"></paper-icon-button> 
      <paper-progress value="10" indeterminate bottom-item></paper-progress> 
     </app-toolbar> 
     </app-header> 
     <app-drawer id="drawer" swipe-open></app-drawer> 
    </template> 
    <script> 
     class MyEl extends Polymer.Element { 
     static get is() { return 'my-el' } 

     constructor() { 
      super(); 
     } 

     ready() { 
      super.ready(); 
     } 

     _toggle() { 
      var drawer = this.$.drawer; 
      drawer.toggle(); 
     } 

     } 
     customElements.define(MyEl.is, MyEl); 
    </script> 
    </dom-module> 

    <my-el></my-el> 
</body> 
</html> 

答えて

1

変更onclickon-clickに、おそらくあなたもgestures-event-listenerをインポートする必要があります。

<link rel="import" href="polymer/lib/mixins/gesture-event-listeners.html"> 
+0

クリックして「ジェスチャー...」をインポートする必要はありません。ただし、オンタップはタッチデバイスでも機能するため(マウスのクリックもサポートされているため)、オンクリックの代わりにオンタップを使用する方がよいでしょう。オンタップするには、「ジェスチャー...」のインポートが必要です。 – grohjy

関連する問題