为什么只有一个 Riot.js 标签呈现?
Why does only one of my Riot.js tags render?
我有一个相对简单的页面,它从 CDN 加载 Riot.js,从本地脚本文件加载 RiotControl,从文件加载 RiotControl 的 Store
,以及两个自定义标签 custom-a
和 custom-b
.
<div class="ui text container" id="context">
<form class="ui form">
<h1>A Descriptive and Lovely Header</h1>
<div class="ui divider"></div>
<custom-a/>
<p>this is just a paragraph</p>
<custom-b/>
</form>
</div>
<!-- Riot.js Ceremony -->
<script>
RiotControl.addStore(new Store());
riot.mount('*');
</script>
正在安装标签 -- console.log
两个标签文件中的行显示 -- 事件正在正确路由(再次通过 console.log
证明)。但是,第一个自定义标签呈现后什么也没有:custom-a
如果在顶部则显示,custom-b
如果在顶部则显示,但它们之间的 <p>
不呈现,另一个如果它在那里,则不会呈现。
我认为 CSS 可能有问题,所以我从页面中删除了语义 UI 链接,但这除了样式之外没有任何区别。
有什么想法吗?
它最终变得非常简单:Riot.js 的 "compile-on-the-fly" 方面似乎不能很好地处理自闭合标签。这很好用:
<custom-a></custom-a>
<custom-b></custom-b>
这不是 Riot 问题,而是浏览器呈现自关闭标签的方式。检查这个 fiddle https://jsfiddle.net/9uezdbo9/1/
之前
<div>Element before</div>
<self-close/>
<div>Element after</div>
呈现
<div>Element before</div>
<self-close>
<div>Element after</div>
</self-close>
ref: https://github.com/riot/riot/issues/1111 检查 GianlucaGuarini 的回答
我有一个相对简单的页面,它从 CDN 加载 Riot.js,从本地脚本文件加载 RiotControl,从文件加载 RiotControl 的 Store
,以及两个自定义标签 custom-a
和 custom-b
.
<div class="ui text container" id="context">
<form class="ui form">
<h1>A Descriptive and Lovely Header</h1>
<div class="ui divider"></div>
<custom-a/>
<p>this is just a paragraph</p>
<custom-b/>
</form>
</div>
<!-- Riot.js Ceremony -->
<script>
RiotControl.addStore(new Store());
riot.mount('*');
</script>
正在安装标签 -- console.log
两个标签文件中的行显示 -- 事件正在正确路由(再次通过 console.log
证明)。但是,第一个自定义标签呈现后什么也没有:custom-a
如果在顶部则显示,custom-b
如果在顶部则显示,但它们之间的 <p>
不呈现,另一个如果它在那里,则不会呈现。
我认为 CSS 可能有问题,所以我从页面中删除了语义 UI 链接,但这除了样式之外没有任何区别。
有什么想法吗?
它最终变得非常简单:Riot.js 的 "compile-on-the-fly" 方面似乎不能很好地处理自闭合标签。这很好用:
<custom-a></custom-a>
<custom-b></custom-b>
这不是 Riot 问题,而是浏览器呈现自关闭标签的方式。检查这个 fiddle https://jsfiddle.net/9uezdbo9/1/
之前
<div>Element before</div>
<self-close/>
<div>Element after</div>
呈现
<div>Element before</div>
<self-close>
<div>Element after</div>
</self-close>
ref: https://github.com/riot/riot/issues/1111 检查 GianlucaGuarini 的回答