김포이
40
2019-03-16 02:41:18
4
195

Vue.js 객체생성, 함수호출시점 질문입니다.


특정페이지에서 다른 Vue객체를 불러다 쓰려고

모든페이지에서 모든 vue.js를 impot하여 사용중입니다.


공통으로 다 쓰려고 이렇게 구성하다보니

A라는 페이지에 들어갔을때 B페이지의 B Vue 객체도 쓸수있지만

A라는 페이지에서 B Vue까지 생성하다보니 필요하지 않은 함수까지 호출이 되어버리네요.


예를들면

A라는 페이지에서 B Vue의 mounted까지 실행이 되어버리는데요.

Vue 모든 객체를 import하는대신 특정페이지에 들어갔을때 해당하는 Vue의 객체만 실행하는

함수가 있을까요?


created는 뷰가 생성될때

mounted는 해당페이지에서 el을 확인하였을떄 실행되는줄알았는데 아닌거같네요.


답변 미리 감사드립니다

0
0
  • 답변 4

  • Kunie
    533
    2019-03-16 02:52:51

    특정 뷰에서 사용하는 뷰만 임포트 하세요.


    필요없는 함수가 실행되고, 모든 뷰를 임포트해 놓아야 하는 구조는 분명 구조를 잘못잡은겁니다.

    0
  • codepresso
    75
    2019-03-17 12:39:59

    저도 문득 드는 생각에 공식 가이드를 다시 살펴 봤는데요.. mounted 라이프사이클이 el이 실제 dom이 있을때만 작동하는건지 아니면 vue 인스턴스 내부에 el이라는 option이 있을때만 작동하는건지는 잘 모르겠습니다..

    확실한건 하나의 vue인스턴스내의 로직은 해당 el의 dom에 대하여 독립적으로 작동하게끔 설계하는게 좋을거 같네요

    0
  • 김포이
    40
    2019-03-17 18:23:13

    @Kunie 

    조언 감사드립니다.

    모든 뷰를 임포트해 놓아야 하는 구조는 잘못 잡은 구조라고 칭하셨는데 이유 좀 여쭤봐도 될까요?

    제가 이런식으로 구성한이유는

    예를들어 PC의 웹과 핸드폰의 웹을 구분하여 글쓰기에 대한 제한을 두려고할떄

    commonVue라는 뷰 객체가 모든 페이지에 임포트되어 사용하기 위함입니다.

    A라는 페이지 JSP에서

    예를들면 v-if="!commonVue.isMobile" 를 사용하기위함입니다.

    이런식으로 구성하기위해서 Vue.js에서는 어떤식으로 구성하나요?

    댓글 감사드립니다

    0
  • 김포이
    40
    2019-03-17 18:24:45

    @codepresso

    답변 감사드립니다.

    "확실한건 하나의 vue인스턴스내의 로직은 해당 el의 dom에 대하여 독립적으로 작동하게끔 설계하는게 좋을거 같네요"라고 말씀해주셧는데 이유좀 알고싶습니다.

    Vue.js에서 공통함수로로 사용해야할떄는 어떻게 설계 하시나요 ?

    0
  • 로그인을 하시면 답변을 등록할 수 있습니다.