日報個別ページにその人の直近数個の日報を表示する（Vue.jsで）

[harukus]

issue

#2649
(#2660 の作り直し)
#3130

やったこと

• 提出物を確認した時に右側に直近の日報が表示されているのと同じように、日報にもその人の直近の日報が表示されるようにした。（すべてのユーザーが見ることができる。）

提出物での表示

日報での表示

[harukus]

@machida
日報のデザインの修正お願いいたしますm(_ _)m

[machida]

了解ですー

[machida]

@harukus 2カラムにしましたー

[harukus]

@machida ありがとうございます！

[harukus]

@sinsoku
遅くなってごめんなさいm(_ _)m
#2660 でのレビューについて修正いたしました。お時間ある時に確認いただけると幸いです🙇‍♂️

[sinsoku]

JavaScriptはあまり詳しくないので、コードを読んで気になった点を質問させてください！

• なぜ then を2回使っているのか
• forEach, push を使っている理由

Suggested change

	.then((response) => {
	return response.json()
	})
	.then((json) => {
	this.reports = []
	json.reports.forEach((r) => {
	this.reports.push(r)
	})
	this.currentUserId = json.currentUserId
	})
	.then((response) => {
	const json = response.json()
	this.reports = json.reports
	this.currentUserId = json.currentUserId
	})

then を1つにして、 reports もそのまま代入できそうかなと思ったので。

[harukus]

@sinsoku
返信が遅くなって申し訳ありません。

• なぜ then を2回使っているのか
  説明が合っているかわからないのですが、fetchメソッドはPromiseを返し、PromiseはResponseオブジェクトとして解決されるためです。
• forEach, push を使っている理由
  こちらは参考にしたPRのコードをそのまま真似したため、簡潔に書きなおしました。

確認お願いいたします。

[sinsoku]

@harukus
thenは1つにしても動きそうかなと思ったのですが、これだと動かなくなったりするでしょうか？

.then((response) => {
  const json = response.json()
  this.reports = json.reports
  this.currentUserId = json.currentUserId
})

コードが短くなるので、動くなら短いコードの方が良いなと思いました！

[harukus]

@sinsoku
上記のコードでは直近の日報が表示されなくなってしまいました><

[sinsoku]

あれ、動かないのか。
それなら今のコードのままで良さそうです！

[harukus]

@sinsoku
ありがとうございます！

[komagata]

@machida ちょっとこのブランチの日報個別ページのslimが最新と差分が大き過ぎてコンフリクト修正時に間違ってしまったかもです。デザインがずれてしまったのですがちょっと確認してもらってよいでしょうか、すみません。

[machida]

@komagata デザイン調整を行いましたー 見た目はこれで大丈夫なのですが、routes のコンフリクトを解消したのでコードの方のご確認お願いします🙏

直近の日報は全ユーザーが見れるようにしました。

[komagata]

確認しました、OKですー🙆‍♂️

[komagata]

@machida 修正ありがとうございます！
テストが落ちているので再実行しておきました。

[machida]

@komagata テスト通しましたー

[komagata]

確認しました、OKですー🙆‍♂️