纸质菜单按钮未显示在纸质工具栏内

Question

我是 Polymer 的新手，我尝试在纸质工具栏中使用纸质菜单按钮来重现 Kevin Schaaf 在 Polymer Summit 2015 上展示的内容，但事实证明该元素不是显示。下面是我的代码：

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

<dom-module id="input-header">
  <template>
    <paper-toolbar>
      <paper-icon-button icon="mail"></paper-icon-button>
      <div>{{title}}</div>
      <paper-menu-button>
        <paper-icon-button icon="more-vert"></paper-icon-button>
        <paper-input label="Thread name:" value="{{title}}"></paper-input>
      </paper-menu-button>
    </paper-toolbar>
  </template>

  <script>
    Polymer({
      is: 'input-header',
      properties: {
        label: {
          type: String,
          notify: true
        }
      }
    });
  </script>
</dom-module>

我做错了什么？提前致谢。

Answer 1

我不知道你在尝试什么。在 paper-menu-button 中使用 paper-input 应该显示一些项目对我来说没有意义，但无论如何，如果你想在 paper-menu-button 中看到 paper-icon-button 你必须添加下拉菜单 -触发器 class.

代码应该是：

   <paper-toolbar>
      <paper-icon-button icon="mail"></paper-icon-button>
      <div>{{title}}</div>
      <paper-menu-button>
        <paper-icon-button icon="more-vert" class="dropdown-trigger"></paper-icon-button>
        <paper-input label="Thread name:" value="{{title}}"></paper-input>
      </paper-menu-button>
    </paper-toolbar>

paper-menu-button 应该有一些下拉内容，所以我不明白。

也许使用 div 围绕 paper-icon-button 和 paper-input 并设置下拉触发器 class

Answer 2

class这些很重要。此外，您没有定义了下拉内容 class 的纸质菜单。我不确定是否有纸张输入？？？

<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 is not displayed inside a paper-toolbar

polymer

polymer-1.0