강의

멘토링

커뮤니티

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

admin님의 프로필 이미지
admin

작성한 질문수

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

TodoInput 컴포넌트 코드 정리 및 UI 스타일링

component 나누기

작성

·

340

1

예를 들면 main.vue 파일에 아래의 내용이 있으면

box_wrap 이라는 컴포넌트 만들어주고 파일이름은 todo.vue 라고 짓고 todo.vue안에   다시 lnb_box,  abox, bbox라는 컴포넌트를 일일이 다 만들어줘야 하나여 ?..

<div class  = contents>

     <div class = 'box_wrap'>

         <h1>여러가지 박스</h1>

          <div class = 'lnb_box'>

         </div>

          <div class = 'abox'>

                <h2>abox></h2>

                <input type ='text'>

          </div>

         <div class = 'bbox'>

                <h2>bbox></h2>

                <input type ='text'>

          </div>

     </div>

</div>

답변 1

0

캡틴판교님의 프로필 이미지
캡틴판교
지식공유자

안녕하세요 admin님, 컴포넌트는 자주 반복되는 UI 코드를 재활용하기 위한 목적으로 사용됩니다. 어떻게 나누는지에는 정답이 없고 스스로 구현하시기에 편할 것 같은 부분을 컴포넌트로 쪼개서 활용하시면 될 것 같습니다. 적어주신 마크업만 봤을 때는 반복되는 구간이 많아 컴포넌트로 분리해서 사용하셔도 좋을 것 같네요..!

admin님의 프로필 이미지
admin

작성한 질문수

질문하기