Vue的快速入門

1 環境準備

完成後通過cmd開啟控制台輸入node -v 可以看到版本資訊

nrm ls 檢視映象倉庫 nrm use taobao 使用taobao這個映象倉庫 nrm test taobao 測試連線速度

3. 安裝完成後重啟電腦

4.1 開啟idea 建立乙個static web 專案 hello-vue 

2 開啟terminal控制台進入 專案目錄 cd hello-vue  然後進行初始化 命令 npm init -y

成功後的專案目錄：hello.html是我建立的

2 測試練習：

1新建乙個html 例如 hello.html

}

//vue渲染需要放在html語句後面 先有需要渲染的元素然後才能繫結元素
el:"#div", //繫結需要渲染的元素
data:
})

2 建立 test2.html 測試 雙向繫結和事件處理

1

doctype html
>
2<
html 
lang
="en"
xmlns:v-on
="">
3<
head
>
4<
meta 
charset
="utf-8"
>
5<
title
>雙向繫結
title
>
6<
script 
src="node_modules/vue/dist/vue.js"
>
script
>78
head
>
9<
body
>
10<
div 
id="div"
>
11<
h1>這只是個標題
h1>
12 你有幾隻羊？<
input 
type
="text"
v-model
="num"
placeholder
="請誠實哦"
>
13<
button 
v-on:click
="add"
>+
button
><
br />
14我有}隻羊。
15div
>
16<
script
>
17let div 
=new
vue(,
22methods:26}
27})
28script
>
29body
>
30html
>

頁面}與資料num繫結 num變化 頁面效果變化

（通俗講 就是你把輸入框裡的2 改變 下一句的我有2隻羊的2也會改變）

其它事件就是  v-on:事件名

好了入門就這些吧

vue快速入門

一 什麼是 vue vue 是乙個用於構建使用者介面的漸進式的js框架，vue 的核心是mvvm雙向資料繫結模式及元件化開發，它使得開發前端不僅易於上手，還便於與vue的優良生態或既有專案整合。二 快速開始 1.在頁面引入vue的js檔案即可。注意 cdn是一種加速策略，能夠快速的提供js檔案 2....

vue快速入門

一 什麼是 vue vue 是乙個用於構建使用者介面的漸進式的js框架，vue 的核心是mvvm雙向資料繫結模式及元件化開發，它使得開發前端不僅易於上手，還便於與vue的優良生態或既有專案整合。二 快速開始 1.在頁面引入vue的js檔案即可。注意 cdn是一種加速策略，能夠快速的提供js檔案 2....

vue快速入門 4

每個 vue 應用都是通過用vue函式建立乙個新的vue 例項開始的 var vm new vue 在建構函式中傳入乙個物件，並且在物件中宣告各種vue需要的資料和方法，包括 等等 接下來我們一 一介紹。每個vue例項都需要關聯一段html模板，vue會基於此模板進行檢視渲染。我們可以通過el屬性來...