【Riot.js】カスタムタグを外部ファイルで保存し、その中でJSONを読み出したい

Question

質問概要

Riot.jsで、カスタムタグの定義を外部の.tagファイルで保存したとき、
その外部ファイル内でJOSNを読み出したい。

質問詳細

Riot.jsで、カスタムタグの定義を外部の.tagファイルで保存したとき、
その外部ファイル内でJOSNを読み出したいと思うのですが、うまくいきません。

例えば、news.tagファイルを作り、

<news>
	<ul>
		<li each='{ items }'>{date} - {info}</li>
	</ul>

	<script>
	var self = this;
	self.items = [];

	$.getJSON("./json/news.json", function(json){
		self.items = json;
		self.update();
	});
	</script>

</news>

のようにして、HTML側で、

<news></news>

<script>

	$(document).ready(function(){
		/* Riotのマウント */
		riot.mount('*');
	});

</script>

のように設定しています。

しかし、どうもJOSNがロードされていないようです。
値を直接指定した場合はきちんと表示されます。

このように、tagファイルからJSONファイルをロードする場合は、
どのように設定すれば良いのでしょうか。

ご存じの方がいらっしゃいましたら、ご教示頂けると幸いです。
よろしくお願いいたします。

参考サイト

• jiichan.com 団塊爺ちゃんの備忘録
• http://outofmem.hatenablog.com/entry/2016/09/11/004030

Answer 1

Riot.js初めて見ました。面白そうなライブラリですね。

公式ドキュメントを見たところ、
tag内でAjaxは使用できるみたいなので、
単純にパスが間違っているなどではないでしょうか。

ブラウザのDeveloperToolsでネットワークを監視してみて、
リクエスト先のパスが正しいか確認してみると解決するかもしれません。

<my-tag>

  <input name="username" onblur={ validate }>
  <span class="tooltip" show={ error }>{ error }</span>

  var self = this

  validate() {
    $.get('/validate/username/' + this.username.value)
      .fail(function(error_message) {
        self.error = error_message
        self.update()
      })
  }
</my-tag>

Comments

[nnahito]

ご回答ありがとうございます！

＞Riot.js初めて見ました。面白そうなライブラリですね。
私もQiitaで、「Riot.js」 + 「Materialize.css」が良い！と見かけて使い始めてみました。

そしてできなかった原因ですが、お恥ずかしいお話、JSONがだめなようでした。
シングルクォーテーションじゃだめだったのですね…
それを直せばうまく動きました！ありがとうございます！！

[mukkun]

JSONはコメントとかも使えないですからね。。

解決されたようでよかったです。
頑張って下さい！