Riot.jsで素のHTMLを埋め込むのに公式では以下のようなRaw
カスタムタグを作る事を推奨しています。
エスケープしないでHTMLを表示する
<raw>
<span></span>
this.root.innerHTML = opts.content
</raw>
このRaw
、初回実行時には上手く動くのですが、親要素がcontent
を変更しても再描画は走りません。
もちろん、同じ事にひっかかる人はいるのでRiot.jsのGithubに何個かIssue立ってました。
<raw> tag that supports updates in riotjs guide #2139
innerHTML value does not update, script doesn't refire #1283
解決策
普通に変数の変更を検知すればいいので以下のような感じにすれば動きます。
<raw>
<span></span>
this.root.innerHTML = opts.content
this.on('update', function() {
this.root.innerHTML = opts.content
})
</raw>
公式にPR出してみますわ...
追記
Add note for unescaped HTML on japanese doc #202
ドキュメント更新のPR出したので近く更新されると思います。
masterに取り込まれたのでドキュメント更新されます、この記事もう必要ないですねw はい。