버튼을 클릭하면 반환된 JSON 데이터에 대해 VueJS 필터링을 수행합니다.

Question

버튼을 클릭하여 얻은 json 데이터를 필터링하여 클릭한 버튼(내 경우에는 책 이름)과 일치하는 데이터만 표시하고 다른 버튼(책)이 숨겨질 때까지 일치하지 않는 다른 데이터를 필터링하고 싶습니다. 일치하는 다른 이름.

다음과 같이 구성 요소에 데이터를 목록으로 채웠습니다.

으아악

다음과 같이 올바르게 렌더링됩니다.

1. 연금술사
2. 해리포터
3. 잠깐...

이제 버튼(하드코딩)이 있으며 결과를 필터링하고 클릭한 버튼만 표시하려면 버튼이 필요합니다.

으아악

내 JSON 데이터는 다음과 같습니다.

으아악

이 문제를 해결하기 위한 어떤 아이디어라도 주시면 감사하겠습니다

Answer 1

작업 데모:

으아악 으아악