[Vue.js] mount(마운트)

김연후·2025년 3월 26일
0

Vue.js

목록 보기
1/3
post-thumbnail
  • Vue.js에서 mount란?
Vue 애플리케이션을 HTML 문서의 특정 DOM 요소에 "붙이는" 작업을 의미한다.
이를 통해 Vue 애플리케이션은 HTML 문서와 연결되어 실제 화면에 렌더링 된다.

(여기서 렌더링이란, Vue 컴포넌트가 HTML 문서의 특정 DOM 요소에 
"붙여져" 화면에 표시되는 과정을 의미한다.)
  • Vue.js의 mount 과정
~html~

<div id="app"></div>

<script src="https://unpkg.com/vue"></script>
<script>
  Vue.createApp({
    data() {
      return {
         message: 'Amazing SpiderMan!'
         };
       }
     }).mount('#app');
</script>
위의 코드처럼 Vue.js에서는 애플리케이션을 특정 DOM 요소에 mount하여 해당 요소 안에서
Vue 애플리케이션이 동작하게 만든다.
이 때 mount 과정에서 Vue 애플리케이션의 component instance가 DOM에 삽입된다.
Vue에서는 이 DOM 객체를 component 또는 component instance라고 부른다.

결론,
Vue.js에서 mount는 Vue 애플리케이션을 특정 DOM 요소에 연결하여 화면에 나타나게 만드는
중요한 과정이다. 이를 통해 Vue는 데이터를 관리하고, 웹 페이지에 반영되는 동적인 UI를 만들어낸다.

0개의 댓글