줄 바꿈을 추가하기 위해 <br> html을 사용하지 않는 기능

Question

저는 현재 Vue JS를 배우고 있으며 API에서 정보를 가져와 주어진 2자리 국가 코드를 기반으로 국가에 대한 사실을 표시하는 간단한 앱을 만들었습니다. API에서 검색된 데이터는 country 和 properties에 매핑됩니다. 시간대, 통화, 인구 등 국가에 대한 자세한 정보를 저장합니다. 그러나 일부 국가에서는 일부 정보가 누락되었습니다. 나는 정보 중 하나가 누락되었을 때 줄 바꿈을 표시하도록 UI를 얻으려고 노력해 왔습니다.

여기서 얻은 데이터가 null이거나 빈 배열이면 country 和 properties 사전의 항목은 빈 문자열입니다.

으아악

메서드에는 country 或 properties 的任何值等于空字符串，则返回
화면에 줄 바꿈 문자를 표시하는 기능이 있습니다.

으아악

UI에 이렇게 나타나는데, 제가 원하는 모습은 아닙니다.

이것은 내 app.vue입니다. 저의 주요 관심사는 위와 같습니다. 코드를 개선하는 방법에 대한 피드백도 찾고 있습니다. 어떤 의견이라도 보내주시면 감사하겠습니다. 매우 감사합니다.

Answer 1

API에서 데이터를 가져온 후에는 이를 올바른 구조(JavaScript 개체)에 매핑하는 것이 좋습니다. 따라서 세부 정보(속성)의 숨김을 제어하거나 다른 목적으로 데이터를 변환할 수 있습니다.

예:

으아악