点击后纸盘抽屉不会关闭菜单

我正在使用聚合物和aurelia，并有一个从侧面打开的菜单。但是，当我在手机中点击菜单中的项目后，它不会自动关闭。点击后纸盘抽屉不会关闭菜单

<paper-item if.bind="!authenticated" class="login" style="padding-left:10px"> 
    <a paper-drawer-toggle href="/login" class="nav-link"> 
     <span class="fa fa-sign-in"></span> 
     <span if.bind="fullmenu" class="nav-item">Login</span> 
    </a> 
</paper-item>

来源

2017-05-04 Anonymous Person

这是完整的解决方案：

<paper-item if.bind="!authenticated" class="login" style="padding-left:10px"> 
    <a paper-drawer-toggle href="/login" class="nav-link" click.delegate="close()"> 
    <span class="fa fa-sign-in"></span> 
    <span if.bind="fullmenu" class="nav-item">Login</span> 
    </a> 
</paper-item>

，然后这是JavaScript

close() { 
    if (!this.widescreen) { 
     let drawer = document.getElementById('drawerPanel'); 
     drawer.closeDrawer(); 
    } 
}

这是链接到聚合物的文档，我们发现我们需要 https://www.webcomponents.org/element/PolymerElements/paper-drawer-panel/paper-drawer-panel#methods

答案

来源

2017-05-08 13:46:16

我已经使这一个最好的答案，因为这是实际解决问题的解决方案。 –

不客气。 – Tom

我不能得到paper-drawer-toggle工作，并且不得不创建一个函数来处理它;

close() { 
    let drawer = document.getElementById('drawerPanel'); 
    drawer.toggle(); 
    return true; 
}

然后，只需将该功能添加到click.trigger;

<paper-item if.bind="!authenticated" class="login" style="padding-left:10px"> 
    <a paper-drawer-toggle href="/login" class="nav-link"> 
     <span class="fa fa-sign-in"></span> 
     <span if.bind="fullmenu" class="nav-item">Login</span> 
    </a> 
</paper-item>

来源

2017-05-04 08:15:04 Tom

这个伟大的工程。唯一的问题是，drawer.toggle（）该元素没有被定义。我反而需要的是drawer.closeDrawer（）和drawer.openDrawer（）。当我这样做的时候，这一切都很好。 –

点击后纸盘抽屉不会关闭菜单

回答

相关问题