API で vue-router を使用してテーブル データをハイパーリンクする

Question

API (https://restcountries.com/) からデータを取得して表示していますが、router-link タグを使用して各テーブル エントリを独自のページにハイパーリンクすることができません。何も起こらず、エラーもリンクテキストも表示されません。

リーリー

キー「name」から .common を削除すると、router-link は機能しますが、必要な 1 つの「一般的な」名前だけでなく、国名のすべてのバリエーションが表示されます。さらに、.common を削除すると、ルーター リンクは次のように機能しなくなります:

「TypeError: 未定義のプロパティを読み取れません ('name' を読み取ってください)」 「プロパティまたはメソッド 'country' はインスタンスで定義されていないため、レンダリング中に参照されます。」

この正確なルーター リンクを使用している他の場所ではこのようなエラーは発生していませんし、これらのファイルには「名前」が定義されていません)、ルーター リンクを取得できる唯一の方法は、次のパラメーターを使用することです: { id: data.item._id } (ただし、何にもリンクしていません (「/unknown?fullText=true」にリンクしようとします))

Answer 1

ルーターリンクのパラメータは params: {country: data.item.name.official }}

である必要があります。