Vue 2의 전역 함수에서 관찰자를 반환하는 방법

Question

안녕하세요, 질문이 있습니다. main.js에는 API에서 사이트 목록을 검색하는 전역 함수 getSites가 있습니다.

이 함수는 async/await를 사용하여 작동하며 사이트 데이터를 비동기적으로 반환합니다.

또한 API에서 데이터를 가져오기 시작할 때 true로 설정한 lockSitesLoading라는 전역 변수가 있습니다. 클라이언트가 서버에 새 요청을 보내는 것을 방지하려면 이 변수가 필요합니다.

첫 번째 함수 getSites에서 이 변수 ​​lockSitesLoading를 확인해야 하며, 이것이 true이면 false로 바뀔 때까지 모니터링을 시작합니다. 이 시점에서 getSites를 재귀적으로 호출하고 싶습니다.

이제 문제가 시작됩니다. 변수를 관찰하기 시작하면 함수가 변수가 false가 될 때까지 기다리지 않고 정의되지 않은을 반환하기 때문입니다.

내 코드는 다음과 같습니다.

Component.vue:

async 마운트() {
    vm = 이것을 하자;
    const 사이트 = vm.getSites()를 기다립니다;
    vm.sites = 사이트.데이터
  },

main.js:

async getSites() {
      vm = 이것을 하자;
      if (vm.$store.state.lockSitesLoading) {
        vm.$watch('$store.state.lockSitesLoading', () => vm.getSites());
      } 또 다른 {
        vm._getSitesOnline()을 반환합니다.
        //실제로 서버에서 데이터를 가져오는 함수입니다.
      }

이 방법으로 해결해 보았으나 해결되지 않았습니다. 어떤 아이디어가 있나요?

Answer 1

설정하셨는지 모르겠어요lockSitesLoading = true, 어디서 설정하셨는지 모르겠어요.

다음은 실제 예시입니다.

으아악 으아악 으아악

Answer 2

기본적으로 기다리겠다는 약속이 필요합니다:

으아악

어떤 이유로 lockSitesLoading실행을 차단하면 메모리 누수가 발생하므로 주의하세요.

컴포지션 API 및 VueUse 컴포지션을 사용하여 이를 달성하는 더 깔끔한 방법이 있을 수 있습니다.