페이지가 변경될때 마다 같은 함수를 mounted() 안에서 실행... - 인프런

Vue로 Nodebird SNS 만들기

페이지가 변경될때 마다 같은 함수를 mounted() 안에서 실행하는 방법이 있을까요?

해결된 질문

작성

1.7K

페이지가 변경됐을때마다 해당페이지에서 한번만 mounted() 안에서 함수를 실행하고 싶습니다.

플러그인에 mixin 으로 아래처럼 했더니

import Vue from 'vue';

if (!Vue.__my_mixin__) {
    Vue.__my_mixin__ = true;
    Vue.mixin({
        mounted() {
            console.log('hello from mixin!');
        },
    });
}

한번만 실행돼야 하는데 모든 컴포넌트에 적용되는지 수십번씩 실행되네요.;;;;

위 방법이 아니더라도 페이지 전환될 때 마다 마운트 후에 함수를 한번 실행하는 방법이 있을까요?

mysql nodejs vuex vuejs aws ssr

답변 4

제로초(조현영)

지식공유자

https://kim-jangwook.medium.com/nuxt-js-cookbook-execute-event-when-route-changes-a1dbe15a82cb

이런 방법이 있습니다. watch: $route 부분입니다.

제로초(조현영)

지식공유자

마운트는 원래 컴포넌트마다 한 번 씩 실행되는 것입니다. 바꾸실 이유가 없습니다. 한 번만 실행되어야하는 이유를 알려주세요. 더 좋은 방법이 있을겁니다.

히나타

질문자

매번 감사합니다^^

히나타

질문자

아~ 페이지가 변경될때에만 주소를 읽어서 특정 함수(주소와 특정 노드들의 값 비교)를 한번만 실행하고 싶었습니다.

노드의 값과 비교하려니 mounted 에 적용하려 했습니다.

일단 default 레이아웃의 watch에 $route(to, from) {...} 형태로 하니 되긴 하는데 맞나 모르겠네요.

다시 확인해보니 watch에 넣으면 새로고침 시에는 작동을 안하네요.;;;

인프런 커뮤니티 질문&답변

페이지가 변경될때 마다 같은 함수를 mounted() 안에서 실행하는 방법이 있을까요?