Question

我是聚合物新手。我想隐藏登录页面中的侧边栏菜单。我有函数IsLoggedIn，它返回true或false。我该如何实现呢？这是我的代码

<app-drawer-layout fullbleed narrow="{{narrow}}">
  <!-- Drawer content -->
  <app-drawer id="drawer" slot="drawer" swipe-open="[[narrow]]">
    <app-toolbar>Menu</app-toolbar>
    <iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation">
      <a name="home-quotes" href="[[rootPath]]home-quotes">Home</a>
      <a name="secret-quotes" href="[[rootPath]]secret-quotes">Secret</a>
    </iron-selector>
  </app-drawer>

  <!-- Main content -->
  <app-header-layout has-scrolling-region>

    <app-header slot="header" condenses reveals effects="waterfall">
      <app-toolbar>
        <paper-icon-button icon="my-icons:menu" drawer-toggle></paper-icon-button>
        <div main-title>My App</div>
        <a name="register-login" href="[[rootPath]]register-login">Login</a>
      </app-toolbar>
    </app-header>

    <iron-pages
        selected="[[page]]"
        attr-for-selected="name"
        fallback-selection="view404"
        role="main">
      <home-quotes name="home-quotes"></home-quotes>
      <secret-quotes name="secret-quotes"></secret-quotes>
      <register-login name="register-login"></register-login>
      <not-found name="not-found"></not-found>
    </iron-pages>
  </app-header-layout>
</app-drawer-layout>

Answer 1

我不完全确定您对侧边栏菜单的意思，但我认为您正在回答抽屉。

您可以使用app-drawer元素上的hidden属性。将函数的返回值存储在属性中并将其绑定到隐藏文件。
在下面的示例中，我将代码拆分为基础以使其更具可读性。

抽屉：

<app-drawer id="drawer" slot="drawer" swipe-open="[[narrow]]" hidden="[[isLoggedIn]]">
   <app-toolbar>Menu</app-toolbar>
</app-drawer>

功能：

loggedIn: function() {
   //I just assume the user is logged in...
   this.set('isLoggedIn', true);
   // You might have to call resetLayout()
   this.resetLayout();
}

Answer 2

将抽屉包裹为from pyspark.sql import SQLContext spark_df = SQLContext.createDataFrame(data_org)。

＆＃13;

<template is='dom-if' if='{{!isLoggedIn}}'></template>

＆＃13;

Answer 3

要完全隐藏应用程序特定页面上的菜单，我必须做两件事：

按照其他答案中的建议隐藏app-drawer（我选择设置hidden属性，但将其包装在dom-if中也应该起作用）
另外，在force-narrow上为这些页面设置app-drawer-layout（see docs），以使页面内容在比响应宽度更宽的屏幕上居中

示例：

<app-drawer-layout
    responsive-width="1024px"
    fullbleed
    force-narrow="[[isHidingMenu(page)]]">
  <app-drawer
      slot="drawer"
      hidden$="[[isHidingMenu(page)]]">
    <!-- ... -->
  </app-drawer>
  <!-- ... -->
</app-drawer-layout>

您需要添加一个实例方法isHidingMenu(page)，如果当前页面不应该包含抽屉菜单，则返回true。

Polymer：在登录页面上隐藏菜单

3 个答案: