Vue.js의 컴포넌트 생성 및 등록 방법 소개

이 기사는 Vue.js의 구성 요소 생성 및 등록 방법을 소개합니다. 이는 특정 참조 가치가 있으므로 도움이 될 수 있습니다.

사용 전 생성

컴포넌트 파일 아래에 나만의 컴포넌트 파일(.vue)을 생성하세요

초기 구조는

<!--html区域-->
<template>
    
</template>

<!--JS区域-->
<script>
    export default {
        name: "hw"
    }
</script>

<!--css区域-->
<style scoped>

</style>

직접 코드 설정을 추가하면 간단한 하위 컴포넌트 파일 생성 완료

<!--html区域-->
<template>
    <p class="hw">
      {{ name }}
    </p>
</template>

<!--JS区域-->
<script>
    export default {
        name: "hw",
      data(){
          return {
            name:"毛没齐"
        }
      }
    }
</script>

<!--css区域-->
<style scoped>
.hw{
  color: blue;
}
</style>

하위 컴포넌트 생성 후 등록을 해야 등록이 가능합니다. 등록은

로 나누어집니다. 1. 부분 등록 컴포넌트: App.vue 파일에 등록하고 App.vue에서도 사용합니다.

2.전체 컴포넌트 등록: main.js 파일에 컴포넌트를 전역으로 등록한 후 App.vue 파일에서

를 사용하세요. 관련 권장사항:

Calendar_html/css_WEB-ITnose

생성 Vue.js 사용

Vue.js 구성요소란 무엇인가요? Vue.js 구성 요소 사용 요약

위 내용은 Vue.js의 컴포넌트 생성 및 등록 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!