Text Interpolation on Vue

 


1. Make Vue Project

npm create vue@latest

cd {ProjectFolder}

npm install

npm run dev


2. Text Interpolation

<script>
export default {
data: function() {        //way to store data on Vue project
return {
channel : "왕초보 홈페이지 만들기",
subscribe: 2677,
score: 85,
sports: [
'Baseball',
'Football',
'Volleyball',
'Swimming',
],
count: 0,
userName: '왕초보',
click_yes : false,
kValue : '',
x: 0,
y: 0,
msg: '',
}
},


}
</script>

<template>
<h1>{{ channel }}</h1>        //show the data
<h2>{{ subscribe }}</h2>

</template>


<style>
#display {
width: 200px;
height: 200px;
background: goldenrod;
}
</style>