Vue-vue基礎快速入門

文文x發表於2020-12-11
Vue

1.認識vue
Vue.js（讀音 /vjuː/, 類似於 view） 是一套構建使用者介面的漸進式框架。

Vue 只關注檢視層， 採用自底向上增量開發的設計。

Vue 的目標是通過儘可能簡單的 API 實現響應的資料繫結和組合的檢視元件。

Vue 學習起來非常簡單，本教程基於 Vue 2.1.8 版本測試。
2.下載vue（也可以直接下載vue.js檔案呼叫，有網條件下可以採用以下呼叫方法）
官方網站：https://cn.vuejs.org/
開發版本（推薦）：

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

生產版本：

<script src="https://cdn.jsdelivr.net/npm/vue"></script>

在這裡插入圖片描述
3.第一個vue專案開發

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue的第一個入門案例</title>
</head>
<body>
<div id="app">
{{msg}}{{username}}
</div>
<!--<script src="js/vue.js"></script>-->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    const app=new Vue({
        el:"#app",//element,用來給vue定義一個作用範圍
        data:{    //用來給vue定義一些相關資料
            msg:"歡迎光臨！！！",
            username:"wenxin"
        },
    });
</script>


</body>
</html>

在這裡插入圖片描述

相關文章