Vue 初體驗

引入Vue

Vue文件地址:

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>

Vue雛形

代碼:

    <html lang="en">
      <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Vue Course</title>
        <script src="Vue.min.js"></script>
        <script>
          window.onload = () => {
            const App = new Vue({
              el: '#main',
              data: {
                message: '456465Hello Vue!',
              }
            });
          }
        </script>
      </head>
    
      <body>
        <div id="main">
            {{ message }}
        </div>
      </body>
    </html>

選擇器可以是id選擇器或者是類選擇器。

注意事項

使用前(在運行時)要確保Vue文件已經加載完成再然後進行其他操作(代碼加載的順序是很重要的)。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章