Vue 學習筆記1 Hello_Vue
阿新 • • 發佈:2020-08-18
第一步:匯入Vue
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.js"></script>
第二部:在html中寫Vue標籤
<div id="app">
<p>{{ message }}</p>
</div>
第三部:在html中寫對應指令碼,對Vue標籤進行操作
let tmp =new Vue({
el: '#app',
data: {
message: 'Hello Vue'
}
})
完整程式碼:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Lesson 1 Hello Vue</title> <script src="https://cdn.staticfile.org/vue/2.2.2/vue.js"></script> </head> <body> <div id="app"> <p>{{ message }}</p> </div> <script> let tmp = new Vue({ el: "#app", data: { "message": "Hello Vue" } }) </script> </body> </html>