パート5 - 動的セグメント

リマインダーにマウスオーバーすると、「X」アイコンが表示されます。クリックするとリマインダーが削除されますが、コンソールを見るとエラーが表示されます。

Mirage: アプリケーションが '/api/reminders/1' に対して DELETE を試みましたが、このリクエストを処理するルートが定義されていません。

これは、このDELETEリクエストをモックアウトしていないためです。今すぐそれを行いましょう。

DELETEリクエストは、/api/reminders/1/api/reminders/2などに送信される可能性があるため、URLに動的セグメントを使用する必要があります。

この新しいルートハンドラーをサーバーのroutes()に追加します。

this.delete("/api/reminders/:id", (schema, request) => {
  let id = request.params.id

  return schema.reminders.find(id).destroy()
})

/api/reminders/:idのコロン:は、URL内の動的セグメントを示す方法です。 request.params.idを使用して、セグメントの実行時の値にアクセスできます。次に、schemaを使用して対応するリマインダーを見つけ、destroy()を呼び出してMirageのデータベースから削除します。

アプリケーションをリロードして、リマインダーの削除を試してください。 204の成功レスポンスが表示され、Aboutに移動してから戻ると、/api/remindersへの新しいGET呼び出しから返されるデータには、削除したリマインダーは含まれていません。

まとめ

  • ルートハンドラーのURLで動的セグメントを定義するには、:segmentNameを使用します。
  • request.params.segmentNameを使用して動的セグメントにアクセスします。
  • destroy()のようなschema.*メソッドを使用して、データの整合性を維持します。