riot.js：动态添加标签并安装它

我对riot.js非常陌生，可能是我问了一个明显的问题。riot.js：动态添加标签并安装它

如果我静态添加标签，然后装入它 - 一切正常。但是，如果我尝试使用JavaScript动态添加标签 - 我什么都看不到。我想我必须以某种方式挂载新创建的元素，但我不知道如何做到这一点。

<script src="https://cdnjs.cloudflare.com/ajax/libs/riot/2.6.7/riot+compiler.min.js"></script> 
 
<body> 
 
    <h1> 
 
    testing riot.js 
 
    </h1> 
 
    
 
    <ol id="list"> 
 
    <li> 
 
     <example></example>  
 
    </li> 
 
    <li> 
 
     <example></example>  
 
    </li> 
 
    </ol> 
 
    <button onclick="addTag()">Add tag</button> 
 
    
 
    <script type="riot/tag"> 
 
    <example> 
 
    <p>Welcome to Riot.js</p> 
 
    </example> 
 
</script> 
 

 
<script> 
 
\t riot.mount('example'); 
 
    
 
    function addTag(){ 
 
    \t var list = document.getElementById("list"); 
 
    var li = document.createElement('li'); 
 
    list.appendChild(li); 
 
    
 
    var tag = document.createElement('example'); 
 
    li.appendChild(tag) 
 
    } 
 
</script> 
 

 
</body>

来源

2016-11-17 never

必须调用riot.mount您添加节点到DOM后：

function addTag(){ 
    var list = document.getElementById("list"); 
    var li = document.createElement('li'); 
    list.appendChild(li); 

    var tag = document.createElement('example'); 
    li.appendChild(tag) 
    riot.mount(tag, 'example'); 
}

来源

2016-11-17 09:05:51 Antoine

谢谢你，优秀的答案！只需安装DOM元素本身。 – never

riot.js：动态添加标签并安装它

回答

相关问题