聚合物。 Paper-submenu触发器适用于纸张项目中的两个元素

Question

我在Polymer的纸张菜单/子菜单中需要一些帮助。 我的任务是制作基于纸张菜单的树形结构的导航面板。 所以，我在paper-item标签里面有“menu-trigger”类的问题，我在paper-item里面有两个元素：icon和链接有两个不同的事件点​​击它们。 当我点击图标时，它会折叠另一个纸质菜单，当点击链接时它会执行另一个事件，但现在它们都会折叠另一个菜单。 我该如何分开这些事件？

PS：抱歉我的英文:)

  <paper-menu>
    <paper-submenu>
      <!--Problem starts here-->
      <paper-item class="menu-trigger">
        <i class="material-icons">&#xE2C7;</i>
        <a (click)="someAction()">Test 1</a>
      </paper-item>
      <!--And finishs here-->
      <paper-menu class="menu-content sublist">
        <paper-submenu>
          <paper-item class="menu-trigger">
            <i class="material-icons ">&#xE313;</i>
            <a>Test 1.1</a>
          </paper-item>
          <paper-menu class="menu-content sublist2">
            <paper-item>
              <a>Test 1.1.1</a>
            </paper-item>
            <paper-item>
              <a>Test 1.1.2</a>
            </paper-item>
          </paper-menu>
        </paper-submenu>
        <paper-item>
           <a>Test 1.2</a>
        </paper-item>
        <paper-item>
           <a>Test 1.3</a>
        </paper-item>
      </paper-menu>
    </paper-submenu>
  </paper-menu>  

Answer 1

只需使用一些on-tap或on-click事件和一些js来显示/隐藏子菜单。

Answer 2

所以，如果有人对这个问题的某些解决方案感兴趣：我使用了pointer-events: none; 在css中，但我认为这不是最好的主意，所以这就是为什么我决定使用event.stopPropagation(); 。

Answer 3

点击纸张菜单/子菜单时，触发的事件很少。

iron-activate :(选择或取消选择）

iron-deselect ：取消选择

iron-items-changed ：选择项目更改

iron-select ：选择事件

这些事件有两个参数 （ 事件 ， 选择项 ），根据您的要求采取选择项并应用您的逻辑

更多信息： https ： //elements.polymer-project.org/elements/paper-menu