๋ฐ์ํ
๋ฐ์ดํฐ ๋ฐ์ธ๋ฉ ๋ฐฉ๋ฒ ์ค ํ๋์ธ {{ }} ์์ ์๋ฐ์คํฌ๋ฆฝํธ ํํ์์ ๋ฃ์ผ๋ฉด ๋๋ค.
<!DOCTYPE html>
<head>
<title>Javascript Expression</title>
</head>
<body>
<div id="app">
<p>{{ message }}</p>
<p>{{ message + "!!!" }}</p>
<p>{{ message.split('').reverse().join('') }}</p>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
}
})
</script>
</body>
</html>
ํ์ง๋ง ๋ถ๊ธฐ ๊ตฌ๋ฌธ(if๋ฌธ ๋ฑ๋ฑ), ์ ์ธ๋ฌธ(var a = 10; ์ด๋ฐ๊ฒ), ๊ทธ๋ฆฌ๊ณ ์์ ๊ฐ์ด ๋ณต์กํ ์ฐ์ฐ(message.split('').reverse().join(''))์ ์ฌ์ฉํ ์ ์๋ค.
๋ฐ์ํ
'JavaScript > Vue' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
[Vue.js] computed ์์ฑ๊ณผ methods ์์ฑ์ ์ฐจ์ด์ (0) | 2022.06.06 |
---|---|
[Vue.js] Vue Directive (0) | 2022.06.06 |
[Vue.js] v-bind (0) | 2022.06.06 |
Named View (0) | 2022.06.06 |
Nested Router (0) | 2022.06.06 |
๋๊ธ