[VUE, JS] Vue.js에서 Vuex와 함께 동적 컴포넌트(다이나믹 컴포넌트) 사용하기

____    기존소스    ____

Line 622	import 문	Softphone 이라는 변수에 components/Softphone.vue 를 선언
Line 628	components 문	Softphone 이라는 변수는 componenets 로 사용할것을 선언
Line 634	level: 1,	레벨값을 Softphone

부모 vue 이며 자식 컴포넌트로 softphone 을 불러올 수 있도록 선언해준다.

페이지가 열리면서 동시에 실행되는 components 들이 데이터를 공유받을 수 있도록 data(){return} 이 있다.

 

부모 vue 이며 자식 컴포넌트로 softphone 을 불러온다.

 

자식 vue 로 부모 MainLayout 에서 불러와지며,  추가로 Lint 17 에서 부모에게 받은 level 값에 따라 다른 자식 vue 를 불러오도록 돼있다.

 

____    변경된 소스    ____

변경이유는 기존소스는 2단계로 불러오다보니 부모(MainLayout)가 손자(Softphone4Genesys, ~) 를 제어할 수 없다.