inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념

router-view를 이용한 라우팅 컴포넌트 표시

App.vue에서 Router-View를 두 번 사용가능한가요?

1280

송승윤

작성한 질문수 4

0

안녕하세요,

강의를 열심히 듣던중 Zum 홈페이지를 보다가 전체화면을 중심으로 왼쪽에는 기사제목이 나오고 해당 제목을 클릭하면 오른쪽에는 기사 내용이 나오게 되는 모습을 보았습니다.

궁금해서 Router로 간단하게 구현해 보는 과정 중에 Router view가 왼쪽과 오른쪽이 중복이 되어서 나오는데요...

혹시 router-view를 하나의 화면에 두 개로 사용이 가능한지 여쭙고 싶습니다.

구글링 해서 찾아보니 아래와 같은 소스가 있긴 한데요...

const router = new VueRouter({

routes: [

{

path: '/',

components: {

default: Foo,

a: Bar

}

}

]

})

화살표 함수를 사용 중이였는데 (=>) 이럴 경우는 어떻게 하는지 궁금합니다.

  1. router-view를 두 번 사용하기
  2. route안에서 => 화살표 함수로 두 개 이상 vue를 나타내는 방법
  3. 실무에서도 router-view를 한 화면에서 많이 사용하는 가요???

vuejs javascript

답변 1

2

캡틴판교

안녕하세요 승윤님,

질문하신 내용은 뷰 라우터의 Named View인 것 같네요. 아래에 링크 달아드릴테니 확인해보세요. 참고로 Vue.js 초급 강좌와 Do it! Vue.js 입문 책에도 해당 내용이 언급 되어 있으니 혹시 자료 있으시면 다시 보시면 좋을 것 같아요!

https://router.vuejs.org/guide/essentials/named-views.html

수강해주셔서 감사합니다!

깃 권한 요청 드립니다

0

50

1

깃 권한 신청

0

50

1

깃 권한 요청드립니다.

0

111

1

깃허브 권한 요청 드립니다

0

145

1

깃허브 권한 요청 드립니다

0

162

1

깃허브 권한 요청 드립니다

0

168

1

깃허브 권한 요청 드립니다.

0

154

1

안녕하세요 vue 2.7로 수강하고 있는 학생입니다. 실무에서 최하위 자식의 props와 watch의 관계를 여쭈고자 합니다.

0

208

1

ide 타입추론 기능 사용할 수 없을까요??

0

207

1

컴포넌트 링크는 vue peek 익스텐션 설치가 필수인가요??

0

228

1

Vue3로 진행중입니다

1

338

1

Vue router-link 사용시 같은 url이면

1

507

1

vue3 에러 메세지...

1

671

2

id ="app" 중복

0

271

2

use undefined 에러가 나옵니다.

1

319

2

깃허브 권한 요청드립니다.

1

359

2

권한요청드립니다.

1

299

2

Vue3에서 구글 애드센스 탑재하기

1

437

2

코드가 정상 작동 되는건지 ...

1

303

1

강의에서 api를 따로 빼셨는데 얻는 이점이 뭐죠?

1

244

1

vuex 적용시 질문

1

288

2

라우터 버전이 안맞는데 어떤걸 써야하나요

1

385

2

UserView에 id 속성만 undefined로 넘어오는데 이유를 모르겠습니다..

1

455

2

권한요청 드립니다!

1

275

2