Polymer 1.0 纸菜单按钮 horizo​​ntalAlign 和 horizo​​ntalOffset 不起作用

Question

我有以下代码:

<paper-toolbar id="mainToolbar">
    <paper-icon-button id="paperToggle" icon="menu" paper-drawer-toggle></paper-icon-button>
    <div class="app-name">Dashbord</div>
    <span class="flex"></span>
    <paper-menu-button horizontalAlign="right" horizontalOffset="20" verticalAlign="top" verticalOffset="50">
        <paper-icon-button icon="more-vert" 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-toolbar>

菜单按钮按预期工作，但下拉 horizo​​ntalAlign 和 horizo​​ntalOffset 属性没有生效。

让下拉菜单正常工作的唯一方法是对元素定义中的值进行硬编码:

<iron-dropdown
  id="dropdown"
  opened="{{opened}}"
  horizontal-align="right"
  vertical-align="top"
  horizontal-offset="50"
  vertical-offset="20"
  open-animation-config="[[openAnimationConfig]]"
  close-animation-config="[[closeAnimationConfig]]"
  no-animations="[[noAnimations]]"
  focus-target="[[_dropdownContent]]">
  <paper-material class="dropdown-content">
    <content id="content" select=".dropdown-content"></content>
  </paper-material>
</iron-dropdown> 

Answer 1

请注意您的定义 horizo​​ntalOffset="20" 和工作定义 horizo​​ntal-offset="50" 之间的区别？

尝试将您的代码更改为

<paper-menu-button
    horizontal-align="right"
    horizontal-offset="20"
    vertical-align="top"
    vertical-offset="50">

See property name to attribute name mapping .

Attribute names with dashes are converted to camelCase property names by capitalizing the character following each dash, then removing the dashes. For example, the attribute first-name maps to firstName.