如何將組件傳遞到組件的高分子

假設一個部件是由3個內部組件，其中<outer-tag>的影子DOM看起來是這樣的：如何將組件傳遞到組件的高分子

<div> 
    <h1>The Outer Tag</h1> 
    <my-tag1/> 
    <my-tag2/> 
    <my-tag3/> 
</div>

現在，讓我們說，<outer-tag>，<my-tag1/>和<my-tag3/>總是一樣的。但我想<my-tag2>是可插拔的。即通過了。我將如何做到這一點在聚合物？

來源

2016-09-29 Dave Ford

如果我理解了這個問題，您正在尋找一種將隨機孩子分發到外層標籤DOM（Documentation）的方法。

這裏是你會怎麼做你的榜樣：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Outer-inner tags</title> 
    <base href="https://polygit.org/components/"> 
    <script src="webcomponentsjs/webcomponents-lite.min.js"></script> 
    <link href="polymer/polymer.html" rel="import"> 
</head> 
<body> 

<dom-module id="outer-tag"> 
    <template> 
     <div> 
      <h1>The Outer Tag</h1> 
      <my-tag1></my-tag1> 

      <!-- Tell the <outer-tag> that something will go in here --> 
      <content select=".tag2"></content> 

      <my-tag3></my-tag3> 
     </div> 

    </template> 
    <script> 
     Polymer({ 
      is: 'outer-tag' 
     }); 
    </script> 
</dom-module> 
<dom-module id="random-tag"> 
    <template> 
     <div> 
      <h2>Random Tag</h2> 
      <div>I'm a random component</div> 
     </div> 
    </template> 
    <script> 
     Polymer({ 
      is: 'random-tag' 
     }); 
    </script> 
</dom-module> 

<!-- Here's how to put them together --> 
<outer-tag> 
    <random-tag class="tag2"></random-tag> 
</outer-tag> 


</body> 
</html>

而不是」 .tag2" 你可以更一般寫‘隨機變量’。 select屬性接受類CSS選擇器。

來源

2016-09-29 15:28:26 LeBird

如何將組件傳遞到組件的高分子

回答

相關問題