Vue fetch가 두 번 호출됩니다.

Question

다음 코드 조각이 있습니다:

으아악

fetch가 두 번 호출되는데 이유를 모르겠습니다. 해결책이 있나요?

Answer 1

공유 코드를 보면 이 구성 요소가 두 번 설치되는 것으로 나오므로 이를 설치하는 구성 요소를 살펴보는 것이 좋습니다.

그러나 여러 번 가져오지 않도록 응답을 저장할 수 있습니다

으아악

왜냐하면 tags 是在组件外部声明的，所以它的行为类似于全局变量，因此它是有状态的。每次组件设置태그가 로드되었는지 확인한 다음 캐시된 데이터를 사용하거나 태그를 로드하고 나중에 항목을 업데이트하기 때문입니다.

예제에 대한 몇 가지 참고사항...
이상적으로는 이러한 논리가 별도의 파일에 있어야 하며 더 나은 추상화가 이루어져야 합니다. 예를 들어, API가 여러 개인 경우 이 기능을 공유할 수 있습니다. const {状态、数据、错误} = useApiCall('/tags')。并且您可以直接使用 tags，而不是使用 items，因为示例中的标签已经是 ref. API 호출 상태를 추적하여 해결할 수 있는 경쟁 조건이 있을 수도 있습니다.