如果在polymer 2.x中，则无法访问dom中节点的内容

我正在使用聚合物2.0。我在页面上呈现了以下可折叠内容：

    <template is="dom-if" if="[[smallScreen]]">
        <iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation">
          <a>
            <span>users</span>
            <paper-icon-button icon="icons:expand-more" on-tap="expandClicked" role="button" aria-controls="collapse"></paper-icon-button>
          </a>
          <iron-collapse id="collapse">
            <a name="user-overview" href="#/usr/user-overview">user Overview</a>
            <a name="user-history" href="#/usr/user-history">user History</a>
            <a name="user-detail" href="#/isr/user-detail">user Detail</a>
          </iron-collapse>            
        </iron-selector>
    </template>

当我单击元素以折叠/展开它时，浏览器控制台中会报告以下错误：

user-app.js:49 Uncaught TypeError: Cannot read property 'toggle' of undefined
    at HTMLElement.expandClicked (user-app.js:49)
    at HTMLElement.handler (template-stamp.html:92)
    at Object._fire (gestures.html:535)
    at Object.forward (gestures.html:830)
    at Object.click (gestures.html:811)
    at HTMLElement._handleNative (gestures.html:333)

---

如果polymer脚本中的节点要展开或折叠，请指导如何访问dom。

polymer抛出错误的原因是您的

iron collapse

不是静态节点，而是动态节点

另一个模板中的任何内容都是动态节点，

this.$

只能用于静态节点

为了搜索动态节点，您应该使用

this.shadowRoot.querySelector（选择器）

---

您可以查看以了解更多详细信息。

当我从上述代码中删除dom if语句时，问题已得到解决。相反，我使用CSS媒体查询来显示/隐藏列表。

is

不再推荐在

Polymer2.x

中使用。检查推荐的方法。这对我不起作用-我正在尝试使用this.shadowRoot.querySelector从dom if模板内按id检索元素，它返回null，如果我将元素移到模板外，则它工作正常。我的代码在ready（）方法中，不确定这是否会导致错误difference@codebox

dom，如果

不保证在触发

ready

功能时可用。您必须使用用户

domChange

事件侦听器才能获取元素。

user-app.js:49 Uncaught TypeError: Cannot read property 'toggle' of undefined
    at HTMLElement.expandClicked (user-app.js:49)
    at HTMLElement.handler (template-stamp.html:92)
    at Object._fire (gestures.html:535)
    at Object.forward (gestures.html:830)
    at Object.click (gestures.html:811)
    at HTMLElement._handleNative (gestures.html:333)