LoginSignup
0
1

More than 5 years have passed since last update.

Riot.jsライフサイクル promise superagentで受け取ったデータを即反映させる。 window.onloadを使わない

Posted at

superagentの導入についての説明はしません。
CDNとかnpm install があります。

superagentはajax処理簡単にしてくれる

const request = window.superagent
↑はtagファイルのscriptに書くことでsupeagentが使えます。他のajax処理(jQuery, fetch)をする場合は必要ないです。
お任せします。

file.tag
//ここの値が更新されます
<p>{ item }</p>

以下はfile.tagのscriptに書く

//apiを取得します
GET (url) {
  return new Promise((resolve, reject) => {
    request
      .get(url)
      .accept('application/json')
      .end((err, res) => {
        if (err) {
          console.log(err);
          reject(err);
        }
        if (res) {
          resolve(res);
        }
      });
  })
};
//apiを取得します
Item () {
  const url = 'おまかせurl'
  this.GET(url)
    .then(d => {
       this.item = d;
       this.update();
     })
    .catch(e => {
       console.log(e);
    });
};
this.on('before-mount',() => {
//ライフサイクルイベント
  this.Item();
})

こんな感じで自分は即反映させることができました!!

0
1
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
0
1