vue-router를 사용하여 API의 테이블 데이터 하이퍼링크

Question

API(https://restcountries.com/)에서 데이터를 가져와 표시하고 있지만 라우터 링크 태그를 사용하여 각 테이블 항목을 자체 페이지에 하이퍼링크할 수 없습니다. 아무 일도 일어나지 않고, 오류도 없고, 링크 텍스트도 없습니다.

으아악

"이름" 키에서 .common을 제거하면 라우터 링크는 작동하지만 내가 원하는 하나의 "일반" 이름뿐만 아니라 국가 이름의 모든 변형이 표시됩니다. 또한 .common을 제거하면 아래와 같이 라우터 링크가 작동하지 않습니다.

"TypeError: 정의되지 않은 속성('name' 읽기)을 읽을 수 없습니다." "속성 또는 메서드 '국가'가 인스턴스에 정의되어 있지 않으며 렌더링 중에 참조됩니다."

이 정확한 라우터 링크를 사용하는 다른 곳에서는 이러한 오류가 발생하지 않고 "이름"이 이 파일에 정의되어 있지 않지만) 라우터 링크에 대한 링크를 얻는 유일한 방법은 다음 매개변수를 사용하는 것입니다.

(그렇지는 않지만) 어떤 콘텐츠에도 링크하지 않습니다('/undefine?fullText=true'에 링크를 시도합니다)) { id: data.item._id }

Answer 1

라우터 링크의 매개변수는 params: {country: data.item.name.official }}

이어야 합니다.