LoginSignup
3
0

More than 5 years have passed since last update.

Riot.jsで<Raw>が更新されない問題

Last updated at Posted at 2017-12-14

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 はい。

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0