下拉菜单alwways打开

Question

我正在学聚合物，我在做菜单时遇到了一个小问题。显然，当我添加下拉菜单时，它总是打开显示，它不会随意关闭和打开。另外，我检查了Polymer的github repo代码和它的演示，并且无法找出我做错了什么。

  <paper-toolbar> 
      <paper-menu-button> 
     <paper-icon-button icon="menu" class="dropdown-trigger"></paper-icon-button> 
     <paper-menu class="dropdown-content"> 
     <paper-item>Share</paper-item> 
     <paper-item>Settings</paper-item> 
     <paper-item>Help</paper-item> 
     </paper-menu> 
    <paper-menu-button> 

</paper-menu-button> 
     <div class="title">Title</div> 
     <paper-icon-button icon="refresh"></paper-icon-button> 
     </paper-toolbar> 

Answer 1

你有一个额外的<paper-menu-button>前 </paper-menu-button> <div class="title">Title</div>

这是怎么了你的代码应该看起来

<base href="http://polygit.org/polymer+:master/components/"> 
 
<script src="webcomponentsjs/webcomponents-lite.min.js"></script> 
 
<link href="polymer/polymer.html" rel="import"> 
 

 
<link href="paper-input/paper-input.html" rel="import"> 
 
<link href="paper-slider/paper-slider.html" rel="import"> 
 
<link href="paper-toolbar/paper-toolbar.html" rel="import"> 
 
<link href="paper-menu/paper-menu.html" rel="import"> 
 
<link href="paper-menu-button/paper-menu-button.html" rel="import"> 
 
<link href="paper-item/paper-item.html" rel="import"> 
 
<link href="paper-icon-button/paper-icon-button.html" rel="import"> 
 
    <link rel="import" href="iron-icons/iron-icons.html"> 
 

 
<dom-module id="my-app"> 
 
    <template> 
 

 
    <paper-toolbar> 
 
     <paper-menu-button> 
 
     <paper-icon-button icon="menu" class="dropdown-trigger">+</paper-icon-button> 
 
     <paper-menu class="dropdown-content"> 
 
      <paper-item>Share</paper-item> 
 
      <paper-item>Settings</paper-item> 
 
      <paper-item>Help</paper-item> 
 
     </paper-menu> 
 
     </paper-menu-button> 
 

 
     <div class="title">Title</div> 
 
     <paper-icon-button icon="refresh"></paper-icon-button> 
 
    </paper-toolbar> 
 

 

 

 
    </template> 
 
    <script> 
 
    addEventListener('WebComponentsReady', function() { 
 
     Polymer({ 
 
     is: 'my-app', 
 

 
     properties: { 
 

 
     } 
 

 

 
    }); 
 

 
    }); 
 
    </script> 
 
</dom-module> 
 
<my-app></my-app>

我不知道你是否已经导入的所有所需的imports，但这里是一个Plunkr，你可以看到它的行动