fix: ヘッド画像へ無限にリクエストが飛んでしまう

[inouetakuya]

https://vuejs-jp.slack.com/archives/GENQVSDT3/p1557889295231700

現象

Chrome Dev Tools で Disable cache にチェックを入れた状態で、

https://vuefes.jp/2019/ へアクセスしたときに https://vuefes.jp/2019/_nuxt/img/2d41e4e.png へ無限にリクエストが飛ぶ。

[hashrock]

@inouetakuya
ああっ申し訳ないです、でもなんででしょう…？調べてみます！

DevToolのDisable CacheをOnにするとずっと発火するみたいなんですが、
Service Workerから出ているようなので、Nuxtの仕組みも絡んでいるんでしょうかね…？

[shika358]

@inouetakuya @hashrock
こちらですが､Disable Cache関係なく自分の環境では発生しています｡
キャッシュクリアをしたあとにアクセスすると自動更新が発生しない｡
上記のあとにもう一度更新すると､読み込みループが発生する｡
ような状況のようです｡

[inouetakuya]

うーん、リクエストを飛ばしている箇所は下記のようなのですが、どうやって直せばよいか確認中...

https://github.com/kazupon/vuefes-2019/blob/2f65c2b385318e1a9a82aa634a43077350b6db4e/src/components/TheHeadSection.vue#L279-L283

[inouetakuya]

this.t の最大値を定義してあげれば良さそう。とりあえずプルリク出しますね

setInterval(() => {
  if (this.loadedImages >= 6) {
    if (this.t < 27) { // 最大値が 27 で良いのかは追って確認します
      this.t++
    }
  }
}, 90)