Vue3의 js 파일에서 Vue 인스턴스에 액세스하는 방법은 무엇입니까?

Question

Vue2에서는 Vue 인스턴스에 액세스하여 Vue에 등록된 구성 요소를 사용할 수 있습니다.

test.js

으아아아

위 코드에서는 main.js에서 Vue를 사용하여 등록했기 때문에 toasted 패키지에 액세스할 수 있습니다. 하지만 Vue3에서는 js 파일 내부의 Vue 인스턴스에 접근할 수 없기 때문에 toasted 패키지를 사용할 수 없습니다.

js 파일 내에서 Vue 인스턴스('this')에 액세스하는 방법에 대한 도움이 필요합니다.

Answer 1

// Vue 3 구성 API

으아악

이것은 Vue2와 정확히 같은 방식은 아니지만 원하는 내용이 노출될 수 있습니다.

---

Vue3에서 패키지를 전역적으로 사용할 수 있게 하려면 플러그인에 다음 코드를 추가해야 할 수도 있습니다.

으아악

이 방법으로 옵션 API에서 다음 명령을 사용하여 토스트된 인스턴스를 얻을 수 있습니다. this.$toasted

컴포지션 API를 사용하세요: const { $toasted } = _instance.appContext.app.config.globalProperties;

다른 플러그인: constructor(app) { app.config.globalProperties; }

Answer 2

하루 검색 끝에 js 파일 내의 vue 인스턴스에서 토스트된 구성 요소에 액세스할 수 있었습니다.

먼저 js 파일에서 읽으려면 애플리케이션 인스턴스를 내보내야 합니다

main.js

으아아아

다음으로 애플리케이션 인스턴스의 globalProperties에 구성 요소를 등록해야 합니다.

으아아아

이제 js 파일에서 애플리케이션 인스턴스를 가져오고 토스트 구성 요소에 액세스할 수 있습니다

test.js

으아아아

이 정보가 다른 사람에게 도움이 되기를 바랍니다. 다른/더 좋은 방법이 있으면 알려주세요. 감사합니다