聚合物 - DOM-IF中的項在第一次調用時返回null

我在寫，因爲我在理解聚合物準備和元素如何準確工作方面存在問題。我正在使用Polymer 2.0。聚合物 - DOM-IF中的項在第一次調用時返回null

在我的模板我有這樣的代碼：

<template is="dom-if" if="{{isExpanded}}"> 
     <div id="drop-down-list" > 
      <template is="dom-repeat" items="{{employees}}"> 
       <button on-click="onDropDownItemClick" class="button-style items">{{item}}</button> 
      </template> 
     </div> 
    </template>

上啓動isExpandend是false。所以這些按鈕是隱藏的，甚至沒有創建？

然後在一些功能我切換到isExpandend和true我想更新在這樣一些風格：

var items = this.shadowRoot.querySelectorAll('.items'); 
      for(var i=0; i< items.length; i++){ 
       items[i].style.height = itemHeight; 
      }

的問題是 - 這種解決方案只能用秒以上進入此功能工作。因此，當我第一次調用這個函數時，項目是空的，沒有任何改變，但是當我第二次調用更多的項目時，代碼運行良好。

我應該怎麼做才能修復這個bug？

我應該做些什麼與「異步」我找到了這個堆棧，但我不知道如何使用它。

來源

2017-05-07 Maciej Wójcik

這是Polymer的正確行爲，但爲了能夠提供幫助，請分享您的組件道具和更新'isExpanded'的函數。 – Kyle

我發現了一個可能的解決方案。我加號太模板，DOM，如果

這JS代碼我寫之前：

this.$["templateID"].render();

這是工作，但我不知道這是好？

來源

2017-05-07 21:18:01

這可能不是您的問題的正確答案。 – Ergo

你如何執行isExpanded的開關？通常情況下，當某些東西一開始不起作用，但後來在交互中更新時，這意味着您錯誤地改變了值，也許您應該使用set或push api來通知變化。

你認爲你可以用這個例子創建一個plunker嗎？

來源

2017-05-08 15:50:35 Ergo

聚合物 - DOM-IF中的項在第一次調用時返回null

回答

相關問題