1、node環境
詳細見我之前的文章,node的安裝
2、git環境
git bash命令窗,支持bash命令,cmd不支持bash命令
3、cnpm安裝
cnpm是針對國內使用npm網絡慢的而使用的
在cmd中輸入:
npm install -g cnpm --registry=https://registry.npm.taobao.org
如果node的版本比較低,會執行不成功。需要升級node的版本,直接下載最新的node覆蓋安裝
4、下載vue.min.js和vue-resource.min.js
這是使用cnpm的方式
打開git bash,輸入:cnpm install vue
輸入:cnpm install vue-resource
將下載到的vue.min.js和vue-resource.min.js放到項目中
5、截圖說明
將title的值在data中綁定為hello vue,然后執行cartView方法,將title值修改為Vue hello
6、index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0"> <title>Title</title> </head> <body> <div id="app"> <h2>{{title}}</h2> </div> <script src="js/lib/vue.min.js"></script> <script src="js/lib/vue-resource.min.js"></script> <script src="js/cart.js"></script> </body> </html>
7、cart.js
/**
* Created by kk on 2017/4/16.
*/
var vm =new Vue({
el:"#app",
data:{
title:"hello vue"
},
filters:{
},
mounted:function () {
//類似於jquery中的ready方法
this.cartView();
},
methods:{
cartView:function () {
this.title="Vue hello"
}
}
});