從零開始的vue學習筆記（一）

前言

項目要用vue.js，今天開始自學vue.js官方教程，記錄下本身的學習摘要，方便後面查閱（此筆記按照學習天數，天天一篇）

Vue.js是什麼

Vue是一套用於構建用戶界面的漸進式框架，Vue 被設計爲能夠自底向上逐層應用。Vue 的核心庫只關注視圖層，不只易於上手，還便於與第三方庫或既有項目整合。另外一方面，當與現代化的工具鏈以及各類支持類庫結合使用時，Vue 也徹底可以爲複雜的單頁應用(SPA)提供驅動。

安裝

直接<script> 引入

直接下載開發版的js文件，而後引入到html中，或者直接用cdn的js

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

NPM

npm install vue

大型應用用npm安裝管理(須要安裝node.js環境),能很好地和諸如 webpack 或 Browserify 模塊打包器配合使用

vue cli工具（命令行工具，暫且不學）

Vue 提供了一個官方的 CLI，爲單頁面應用 (SPA) 快速搭建繁雜的腳手架。它爲現代前端工做流提供了 batteries-included 的構建設置。只須要幾分鐘的時間就能夠運行起來並帶有熱重載、保存時 lint 校驗，以及生產環境可用的構建版本。

Vue Devtools

在使用 Vue 時，咱們推薦在你的瀏覽器上安裝 Vue Devtools。它容許你在一個更友好的界面中審查和調試 Vue 應用

初步介紹

概念

1. 聲明式渲染、模板語法、響應式、指令（前綴v-的特殊語法）、數據雙向綁定
2. 基礎指令簡介：
   • 綁定（v-bind）
   • 條件（v-if、v-else、v-else-if、v-show）
   • 循環（v-for）
   • 事件監聽（v-on）
   • 表單輸入數據雙向綁定（v-model）
3. 組件化構建應用（抽象與複用、組件間prop通信）