안녕하세요 선생님 조언좀 구해도 될까요?

일요일 밤늦게 죄송합니다...수업 너무 잘들었고, 신입개발자로서 자바와 스프링쪽만 배웠다가, 회사의 요구로 다급하게 뷰와 노드js를 배우려고 수강 시작했습니다.

다름이아니라 지금 난생처음 실무 투입되었고, 뷰로 개발을 시작했습니다.

뷰3 프로젝트이고, 의뢰 기획서대로 하려고 하는데,

 로그인, 회원가입 페이지는 일단 뒤로 미루고, 로그인 후 페이지가 크게 7장입니다.

App.vue가 부모파일, 그 안에 요청한 기능 메뉴페이지가 7개 입니다. 그리고 이 7개 메뉴페이지는  view 폴더에 모아뒀구요. 이 view 폴더안에 메뉴페이지 7개를 생성하여 라우트로 연결했습니다. App.vue에서 route-view로 보일거구요. 그리고 각 뷰 폴더 안에 상세 기능을 컴포넌트로 집어넣었습니다.   

이런 구조입니다.   그래서 App.vue 를 최상위 부모로 보고, 여기서 데이터를 관리하며, 우선은 router-view에

선생님께 배운대로 프롭스로 데이터를 날리고, 그리고 라우팅된 7개의 vue파일 안에도 자식컴포넌트들이 들어

갈텐데 프롭스로 전송하듯이 하면 되는걸까요?  일단 데이터베이스 소스나 백앤드 소스를 받은게 없어서 강의

하신것처럼 js 파일에 오브젝트형식으로 임의의 데이터를 작성후에 혼자 바인딩 해봤는데,

Main.vue 파일 과 자식컴포넌트 들 밖에 안해봤지만 데이터바인딩은 잘 되네요. 구조상 이렇게 개발해도 괜찮은걸까요?

그리고 의뢰받은 기획서상에는.... 모달창에서 기능 및 데이터 처리를 요구받아서, 수업내용을 참고하여 모달창

을 만들고, 바인딩도 하고, 열고 닫기도 문제잘 작동했는데, 문제는....데이터 처리를 할때, App.vue 안에,

Main.vue 라우트를 타고 그 안에 3개의 자식 컴포넌트들 중에 특정 버튼을 클릭하면, 모달창을 구현하고, 그 안

에서 사용자가 원하는 작업을 처리하는 방식입니다.

근데 이 모달창을 하드코딩을 하든, 컴포넌트화를 하든,  정의되는 위치가 앱.뷰 -> 메인.뷰 -> 자식컴포넌트 안

에 되는데, 모달창이 이 자식 컴포넌트 안에 갇혀서...화면 전체에 나타나질 않습니다.

화면전체에 모달을 구현하려니 앱.뷰 안에 모달 컴포넌트를 정의해야만 구현이 되고...이래되버리면 데이터 방

향이 이상하게 되어버리고....의뢰사 측에 모달 말고 다른 방식으로 구현해야 한다고 해야할까요? 아니면 다른 좋은 방법이 있다면 조언좀 부탁드려도 될까요...?