1. 程式人生 > >學習筆記:VUE

學習筆記:VUE

() uno str span .org 最新 code pkg guid

https://cn.vuejs.org/v2/api/  官網API

https://cn.vuejs.org/v2/guide/  官網教程

http://www.runoob.com/vue2/vue-tutorial.html  教程

CDN:  https://unpkg.com/vue/dist/vue.js

# 查看版本
$ npm -v

#升級 npm
cnpm install npm -g

# 最新穩定版
$ cnpm install vue

# 全局安裝 vue-cli
$ cnpm install --global vue-cli

# 創建一個基於 webpack 模板的新項目
$ vue init webpack my-project

#進入項目,安裝並運行: $ cd my-project $ cnpm install $ cnpm run dev #成功執行以上命令後訪問 http://localhost:8080/


一、指令

v-model  文本框輸入後,模型也會變,雙向

v-text  文本渲染 {}

v-show  dom有,只是顯隱

v-if  dom不存在

v-bind  

v-for  

v-on  事件綁定

二、過濾器 filter

對接口返回的數據,過濾和戰士,比如金額格式化、貨幣等

三、組件

component

頁面頭部、底部、輪播等

var vm = new Vue({
    el:
"#app", data:{},//數據 filter:{},//過濾器 mounted:function(){},//相當於jquery的ready methods:{} });


Vue.js 路由

Vue.js 路由需要載入 vue-router 庫:  https://github.com/vuejs/vue-router

中文文檔地址:  https://router.vuejs.org/zh-cn/

直接下載 / CDN  https://unpkg.com/vue-router/dist/vue-router.js

cnpm install vue-router

..

學習筆記:VUE