Vue初步認識
阿新 • • 發佈:2018-04-22
install edit npm 文件 shell web服務 非阻塞 chrom 命令
JS
var app = new Vue({
el: ‘#app‘,
data: {
message: ‘Hello Vue!‘
}
})
結果:
Hello Vue!
HTML
<div id="app-2">
<span v-bind:title="message">
鼠標懸停幾秒鐘查看此處動態綁定的提示信息!
</span>
</div>
JS
app2 = new Vue({
el: ‘#app-2‘,
data: {
message: ‘頁面加載於 ‘ + new Date().toLocaleString()
}
})
HTML
<div id="app-3">
<p v-if="seen">現在你看到我了</p>
</div>
JS
結果:現在你看到我了
HTML
JS
結果:
學習JavaScript
學習Vue
學習整個項目
Node.js
Node只能在shell中使用,也就是說,想要運行node命令,需要在系統的shell中,比如windows的cmd。node自帶的那個叫repl,不能在其中運行npm命令,只能運行js語句
打開GitBash>>>輸入命令行>>>npm install -g cnpm --registry=https://registry.npm.taobao.org
>>>>>在使用vue命令前,需要安裝cnpm i -g vue-cli 這個腳手架>>>>vue list測試>>>vue init webpack-simple +名稱(小寫)(設置一些東西)>>>>cd+文件名>>>npm install>>npm run dev
什麽是Vue
Vue (讀音 /vju?/,類似於 view) 是一套用於構建用戶界面的漸進式框架(根據需求使用特定的功 能)。與其它大型框架不同的是,Vue 被設計為可以自底向上逐層應用。Vue 的核心庫只關註視圖層,不僅易於上手,還便於與第三方庫或既有項目整合。另一方面,當與現代化的工具鏈以及各種支持類庫結合使用時,Vue 也完全能夠為復雜的單頁應用提供驅動。 關於學習Vue的前置工作/技術儲備 1.GitBatch GitBatch是一個可以編寫shell腳本的工具,今天我們學習的內容在cmd下是不支持的。你要 麽選擇gitbatch,要麽你選擇Linux系統 2高級記事本 UltraEdit UE NodePad++ EditPlus SublimeText 3.Node-----npm 命令 Node.js 是一個基於 Chrome V8 引擎的 JavaScript 運行環境。 Node.js 使用了一個事件驅動、非阻塞式 I/O 的模型,使其輕量又高效。 Node.js 的包管理器 npm,是全球最大的開源庫生態系統。 下載網址:http://nodejs.cn/download/ 單頁面應用 單頁面應用(SinglePage Web Application,SPA) 只有一張Web頁面的應用,是一種從Web服務器加載的富客戶端,單頁面跳轉僅刷新局部資源 , 公共資源(js、css等)僅需加載一次,常用於PC端官網、購物等網站 多頁面應用 多頁面應用(MultiPage Application,MPA) 多頁面跳轉刷新所有資源,每個公共資源(js、css等)需選擇性重新加載,常用於 app 或 客戶端 等。 Vue和React Vue和React目前都用到了VirtualDom 輕量級 響應式組件 服務器端渲染 易於集成路由工具,打包工具以及狀態管理工具 優秀的支持和社區 https://cn.vuejs.org/v2/guide/comparison.html Vue的幾個簡單小例子 HTML<div id="app">
{{ message }}
</div>
var app4 = new Vue({ el: ‘#app-4‘, data: { todos: [ { text: ‘學習 JavaScript‘ }, { text: ‘學習 Vue‘ }, { text: ‘整個牛項目‘ } ] } }) |
Vue初步認識