非nodejs方式的vue.js的使用
生活随笔
收集整理的這篇文章主要介紹了
非nodejs方式的vue.js的使用
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
1、node環(huán)境
詳細見我之前的文章,node的安裝
2、git環(huán)境
git bash命令窗,支持bash命令,cmd不支持bash命令
3、cnpm安裝
cnpm是針對國內(nèi)使用npm網(wǎng)絡(luò)慢的而使用的
在cmd中輸入:
npm install -g cnpm --registry=https://registry.npm.taobao.org
如果node的版本比較低,會執(zhí)行不成功。需要升級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,然后執(zhí)行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" }}});?
總結(jié)
以上是生活随笔為你收集整理的非nodejs方式的vue.js的使用的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 乡土中国礼治秩序读后感
- 下一篇: 赞亲情的古诗词句子204个