Question

我已安装了新的Polymer Starter Kit，并提供以下代码。

<app-drawer-layout fullbleed>

      <!-- Drawer content -->
        <app-drawer>
          <app-toolbar>

如何在布局加载时关闭app-drawer元素？

如果我在元素上触发.close（）应该何时运行？它不适用于准备或附加生命周期回调

但这意味着菜单打开和关闭我想避免，我真正想要发生的是当页面加载菜单关闭时，

当我从服务器收到回叫以说用户已通过身份验证时，请调用

this.$.menu.open() // where i've given app-drawer the if of menu

Answer 1

如果除了用户进行交互之外，无论视口宽度如何，您想要的是不显示抽屉，您只需将app-drawer-layout的{{1}}属性设置为true即可像这样：

forceNarrow

Answer 2

我假设这是跟进：Polymer 1.0 App-Drawer - Uncaught TypeError when not rendered via dom-if

假设：

<app-drawer-layout id="layout" fullbleed>
  <app-drawer id="drawer">
  ...
  </app-drawer>
</<app-drawer-layout>

您可以使用观察员根据<app-drawer>.hidden的新值设置signedIn属性，然后设置<app-drawer-layout>.resetLayout()：

Polymer({
  ...
  properties : {
    signedIn: {
      type: Boolean,
      value: false,
      observer: '_signedInChanged'
    }
  },
  _signedInChanged: function(signedIn) {
      this.$.drawer.hidden = !signedIn;
      this.$.layout.resetLayout();
  }
);

^codepen

聚合物应用程序抽屉打开页面隐藏它

2 个答案: