Vue는 총 3가지로 나뉘어진다.
<template>
<script>
<style>
- template
<html> 이랑 동일하다.
다른 점은 v-text 같은
{{ }} 같은 데이터 바인딩이 들어간다.
<div> 에 아이디 값을 넣어넣고 데이터가 들어갈 장소를 지정해준다.
아니면 불러온 파일에 어떤데이터가 들어갈 것인지 지정해준다.
v-on , v-bind 등이 여기에서 기입된다.
- script
import 로 파일 주소를 불러와서 해당 변수명으로 링크를 걸어주어야한다.
이때 이름은 해당 파일의 이름과 달라도 괜찮다.
같아야하는건 해당 파일 내에 있는
export 데이터 내의 name 요소 이다.
스크립트에서 어떤 데이터가 어떤 요소에 들어갈 건지 결정한다.
- style
Css 요소들이 각 Vue파일내에 있는 tag들에게만 적용되는게 아니다.
전체적으로 전부 다 들어간다.
위 해당 파일의 결과물
MyTest.vue 에서 설정해준
div 배경색이 전체적으로 적용이 되었다.
'프로그래밍 공부 > Vue.js \ React' 카테고리의 다른 글
| 3. Vue.js 작동 순서 (0) | 2020.03.12 |
|---|---|
| Vue.js 시작하기 (0) | 2020.03.09 |