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

VUE學習筆記一

什麼是Vue.js
+打包工具 Webpack , Gulp
+ Vue.js 是目前最火的一個前端框架,React是最流行的一個前端框架(React除了開發網站,還可以開發手機App, Vue語法也是可以用於進行手機App開發的,需要藉助於Weex)

+ Vue.js 是前端的**主流框架之一**,和Angular.js、React.js 一起,併成為前端三大主流框架!

+ Vue.js 是一套構建使用者介面的框架,**只關注檢視層**,它不僅易於上手,還便於與第三方庫或既有專案整合。(Vue有配套的第三方類庫,可以整合起來做大型專案的開發)

+ 前端的主要工作?主要負責MVC中的V這一層;主要工作就是和介面打交道,來製作前端頁面效果;





 為什麼要學習流行框架
 + 企業為了提高開發效率:在企業中,時間就是效率,效率就是金錢;
  - 企業中,使用框架,能夠提高開發的效率;



 + 提高開發效率的發展歷程:原生JS -> Jquery之類的類庫 -> 前端模板引擎 -> Angular.js / Vue.js(能夠幫助我們減少不必要的DOM操作;提高渲染效率;雙向資料繫結的概念【通過框架提供的指令,我們前端程式設計師只需要關心資料的業務邏輯,不再關心DOM是如何渲染的了】)
 + 在Vue中,一個核心的概念,就是讓使用者不再操作DOM元素,解放了使用者的雙手,讓程式設計師可以更多的時間去關注業務邏輯;



 + 增強自己就業時候的競爭力
  - 人無我有,人有我優
  - 你平時不忙的時候,都在幹嘛?

 框架和庫的區別



 + 框架:是一套完整的解決方案;對專案的侵入性較大,專案如果需要更換框架,則需要重新架構整個專案。

  - node 中的 express;



 + 庫(外掛):提供某一個小功能,對專案的侵入性較小,如果某個庫無法完成某些需求,可以很容易切換到其它庫實現需求。
  - 1. 從Jquery 切換到 Zepto
  - 2. 從 EJS 切換到 art-template







 Node(後端)中的 MVC 與 前端中的 MVVM 之間的區別

 + MVC 是後端的分層開發概念;
 + MVVM是前端檢視層的概念,主要關注於 檢視層分離,也就是說:MVVM把前端的檢視層,分為了 三部分 Model, View , VM ViewModel

相關推薦

VUE學習筆記

什麼是Vue.js+打包工具 Webpack , Gulp+ Vue.js 是目前最火的一個前端框架,React是最流行的一個前端框架(React除了開發網站,還可以開發手機App, Vue語法也是可以用於進行手機App開發的,需要藉助於Weex)+ Vue.js 是前端的**主流框架之一**,和Angula

VUE學習筆記() --對VUE作用域的一些思考

我學習有一個習慣,就是在用的時候一定要搞清楚一些基本問題,要不然稀裡糊塗的,腦子裡沒有一根清晰的線,總感覺是一團亂。所以學習筆記裡不會有什麼語法之類的,這些在各大教程裡都講的很清楚,在這裡只記錄一些我自己的思考和理解,如果有不對的地方,歡迎路過的大神幫忙指點。 1.VUE中,作用域及作用範圍

vue學習筆記() 環境搭建

1.對vue的認識 對於vue框架的,官方的解釋是“一套構建使用者介面的漸進式框架”,“只關注檢視層,採用自底向上增量開發的設計”,“目標是通過儘可能簡單的API實現響應的資料繫結和組合的檢視元件”。簡單粗暴的理解就是,vue是一個輕便、簡潔的框架,它可以快速構建一個工程。vue的複用性很高

Vue學習筆記:快速開始vue

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ // 定義狀態 state: { author:'dongwei', isLogin :'100'

Vue學習筆記 建立vue專案

1:安裝Node.js Node.js 是一個基於 Chrome V8 引擎的 JavaScript 執行環境。可以搜尋Node.js的官網下載,安裝完成後,開啟命令提示符cmd.exe,輸入node

vue學習筆記() 環境搭建

1.對vue的認識 對於vue框架的,官方的解釋是“一套構建使用者介面的漸進式框架”,“只關注檢視層,採用自底向上增量開發的設計”,“目標是通過儘可能簡單的API實現響應的資料繫結和組合的檢視元件”。簡單粗暴的理解就是,vue是一個輕便、簡潔的框架,它可以快速構

vue學習筆記()入門

前言 隨著前端不斷的壯大,許多公司對於前端開發者的需求也越來越多了,作為一名優秀的前端工程師,如果連vue和react都不會的話,那真是out了,為什麼那麼說呢?這是我在招聘網站上截的一張圖,十家公司有九家都是需要對vue或者react熟悉,當然僅僅熟悉肯定是不夠的,畢竟掌握住了才能保住自己的鐵飯碗,否則的話

Vue.js實戰 學習筆記 (初識Vue.js)

hid dom 介紹頁面 pan 分離 name 管理 end 筆記 官方文檔中介紹:漸進式技術棧(漸進式即可以階段性地使用Vue,或者可以在使用jQuery的同時,部分模塊上使用Vue,而不是像Angular一樣一用就是全部使用) 在設計上,使用MVVM(Model-V

VUE學習筆記)—安裝vue-cli和建立專案

Github:https://github.com/sueRimn 1.cmd開啟控制檯進行建立專案 (1)全域性安裝腳手架 在命令列輸入:npm install vue-cli -g (2)初始化專案 繼續輸入:vue init webpack myvue(myvue是我取的專案名,

Vue學習筆記

一、指令學習 基本寫法: <body> <div id="app1"> {{message}} </div> <script type="text/javascript"> var vm=ne

Vue 2.0 學習筆記 基於webpack模板建立專案

vuejs 框架需要基於nodejs自帶的npm下載 所以電腦先安裝nodejs 地址:https://nodejs.org/en/download/   1全域性安裝腳手架       npm install --global vue-

vue學習筆記)關於事件冒泡和鍵盤事件 以及與Angular的區別

一、事件冒泡 方法一、使用event.cancelBubble = true來阻止冒泡 <div @click="show2()"> <input type="button" value="按鈕" @click="show1($event)"

vue 學習筆記

例項生命週期鉤子 beforeCreate--->created--->beforeMount--->mounted(beforeUpdate-->updated)---&g

VUE學習筆記)基礎

常用指令 v-model:雙向資料繫結 <div id="app"> 輸入您的姓名: <input type="text" v-model="name"> <p>{{ $data | json

vue 學習筆記

vue學習及應用也有一年多了,但一直沒能系統的總結過。多少有些遺憾。正好趕上找工作,就趁此鞏固、總結下吧。 一、vue生命週期函式 beforeCreate , created // 建立前, 建立完成 beforeMount

VUE學習筆記-vue的簡單介紹

一、vue起步 開發版下載 1.渲染節點資料 <!DOCTYPE html> <html lang="en"> <head> <

Vue學習筆記)元件

在做課設的時候,動態生成表格需要寫一堆js程式碼,於是乎決定採用一個前端框架來簡化編碼過程,之前已經學過Vue的一些知識了,因此直接從元件開始記錄。 1.簡單的元件例項 <div class="vue"> <button-c

vue學習筆記【基礎篇

“時間永遠都不夠用”———–《海賊王》-索隆 介紹 Vue 是一個 MVVM 的 JavaScript 框架,以 json 為基本資料模型,繫結HTML頁面,當 json 從網路中的 json 改變的時候,我們的HTML頁面也會改變。 MVVM

Vue學習筆記:按鍵修飾符和自定義指令(鉤子函數)

ear 簡寫 bar 更多 盜鏈 esc 聚焦 component 默認 目錄 padStart:補位 按鍵修飾符 Vue提供的按鍵修飾符 自定義按鍵修飾符

vue學習筆記)---- vue指令( v-bind 屬性繫結 )

**看栗子:** ```html ``` ![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20201016092756571.PNG?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGV