Panel.setAttribute(“模式”、“瀑布”)；

Question

这是我的核心标题面板

<core-header-panel mode="waterfall-tall">

当我希望它处于瀑布模式而不是瀑布高度时，我就这样做。

var panel = document.querySelector('core-header-panel');
panel.setAttribute("mode","waterfall");

它正确地改变了模式，元素的行为就像瀑布一样，但是元素不会收缩到原来的大小，并且保持高。如何在javascript中将元素再次缩小到正常的瀑布大小？

Answer 1

当mode被切换时，核心标题面板应该真正地为您处理这个问题。它应该进行清理并删除它在子节点上设置的任何tall类。在这里输入了一个bug：https://github.com/Polymer/core-header-panel/issues/11

解决办法是：

coreHeaderPanel.querySelector('.tall').classList.remove('tall')

顺便说一句，您不需要使用setAttribute()。mode是核心标头面板的已发布属性，这意味着您可以将其直接更新为JS属性：

coreHeaderPanel.mode = 'waterfall';

Answer 2

如果我没有弄错的话，你可以将类“高”从核心标题中删除。

var header = document.querySelector('.tall');
header.className = "core-header";