vue的優(yōu)缺點有哪些

本文小編為大家詳細介紹“vue的優(yōu)缺點有哪些”,內容詳細,步驟清晰,細節(jié)處理妥當,希望這篇“vue的優(yōu)缺點有哪些”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學習新知識吧。

公司主營業(yè)務:成都網(wǎng)站建設、做網(wǎng)站、移動網(wǎng)站開發(fā)等業(yè)務。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。創(chuàng)新互聯(lián)公司是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團隊。公司秉承以“開放、自由、嚴謹、自律”為核心的企業(yè)文化,感謝他們對我們的高要求,感謝他們從不同領域給我們帶來的挑戰(zhàn),讓我們激情的團隊有機會用頭腦與智慧不斷的給客戶帶來驚喜。創(chuàng)新互聯(lián)公司推出西和免費做網(wǎng)站回饋大家。

優(yōu)缺點是:簡單、快速、強大、對模塊友好;但不支持IE8,且對于搜索引擎不友好,會影響seo。使用原因:Vue是一款能降低開發(fā)成本、提升開發(fā)效率的工具,它能幫助開發(fā)者從繁瑣的DOM操作中解脫出來;開發(fā)中設定好正確視圖和數(shù)據(jù)的規(guī)則后,只需要關注數(shù)據(jù)的變化,視圖內容是會隨之變化的,不需手動再操作DOM元素進行修改。且Vue的組件化對于提升代碼復用、拆解大型項目,都有著很好的幫助。

什么是 Vue?

Vue (發(fā)音為 /vju?/,類似 view) 是一款用于構建用戶界面的 JavaScript 框架。它基于標準 HTML、CSS 和 JavaScript 構建,并提供了一套聲明式的、組件化的編程模型,幫助你高效地開發(fā)用戶界面。無論是簡單還是復雜的界面,Vue 都可以勝任。

下面是一個最基本的示例:

import { createApp } from 'vue'

createApp({
  data() {
    return {
      count: 0
    }
  }
}).mount('#app')
<div id="app">
  <button @click="count++">
    Count is: {{ count }}
  </button>
</div>

結果展示

vue的優(yōu)缺點有哪些

上面的示例展示了 Vue 的兩個核心功能:

  • 聲明式渲染:Vue 基于標準 HTML 拓展了一套模板語法,使得我們可以聲明式地描述最終輸出的 HTML 和 JavaScript 狀態(tài)之間的關系。

  • 響應性:Vue 會自動跟蹤 JavaScript 狀態(tài)并在其發(fā)生變化時響應式地更新 DOM。

Vue.js的優(yōu)缺點

優(yōu)點:

1. 簡單:官方文檔很清晰,比 Angular 簡單易學。

2. 快速:異步批處理方式更新 DOM。

3. 組合:用解耦的、可復用的組件組合你的應用程序。

4. 緊湊:~18kb min+gzip,且無依賴。

5. 強大:表達式 & 無需聲明依賴的可推導屬性 (computed properties)。

6. 對模塊友好:可以通過 NPM、Bower 或 Duo 安裝,不強迫你所有的代碼都遵循 Angular 的各種規(guī)定,使用場景更加靈活。

缺點:

  • 不支持IE8。

    Vue.js 不支持 IE8 及其以下版本,因為 Vue.js 使用了 IE8 不能模擬的 ECMAScript 5 特性。Vue.js 支持所有兼容 ECMAScript 5 的瀏覽器。

  • vue是單頁面頁面,對于搜索引擎不友好,影響seo.因此不適合做公司官網(wǎng)。比如兩個vue路由(頁面),它的路徑是這樣的:index.html#aaa  和 index.html#bbb,但對于搜索引擎來說,都是同一個頁面,就是index.html。這樣搜索引擎就無法收錄你的頁面。

為什么要用 Vue.js

使用任何新框架和庫其實都是為了解決我們當前開發(fā)所遇到的問題,或者能提升其開發(fā)效率。每個人的成本就是時間,好的工具則能夠幫助我們節(jié)約時間,從項目角度而言,也就幫我們節(jié)約了成本。而 Vue.js 就是一款能降低開發(fā)成本、提升開發(fā)效率的工具,它能幫助我們從繁瑣的 DOM 操作中解脫出來。開發(fā)中,我們設定好正確視圖和數(shù)據(jù)的規(guī)則后,只需要關注數(shù)據(jù)的變化,視圖上的內容是會隨之變化的,而不需要我們手動再操作 DOM 元素進行修改。

此外,前端開發(fā)的模式也逐漸開始往組件化方向轉變,Web Components 的概念也開始逐漸成為標準,擁有自己獨立的 HTML 片段、JS 文件以及 CSS 樣式,這樣在使用時可以不用擔心對自己本身業(yè)務上的代碼造成影響。Vue.js 對這一概念也進行了自己的實現(xiàn),這樣對于提升代碼復用、拆解大型項目,都有著很好的幫助。

vue的一些好處:

1、控件自動跟數(shù)據(jù)綁定,提交表單到后臺的時候,可以直接使用data里面的數(shù)據(jù)值,而不需要再使用$("#id")那一套方法來獲取控件的值,對控件賦值也方便很多,只需要改變data的值,控件就會自動改變值。將復雜的界面操作,轉化為對數(shù)據(jù)進行操作。

比如下面的一段代碼就可以實現(xiàn)了select控件的里面的列表的動態(tài)管理:

html代碼:

<el-select v-model="mType" style="flex: 1;">
  <el-option v-for="(item,index) in enums" :label="item.label" :value="item.value" :key="index"></el-option>
</el-select>

js代碼:

data(){
    return{
    mType:'',
    enums:[{value:0,label:'未婚'},{value:1,label:'已婚'}]
  }
}

當你需要修改select列表的內容的時候,不再需要對dom進行操作,只需要簡單的改變enums的值。當控件選擇的值發(fā)生改變,會自動綁定到data的 mType 字段。

2、頁面?zhèn)髦岛蜖顟B(tài)管理

vue的頁面?zhèn)髦悼晒┻x擇的方法非常多,比如使用子組件屬性傳值,比如使用頁面url參數(shù)的方法傳值,或使用vuex全局狀態(tài)管理的方法頁面?zhèn)髦档鹊?。而原生開發(fā)的時候,在頁面有多個參數(shù)的時候,頁面?zhèn)髦岛统跏蓟?,要復雜很多。而vue,直接將參數(shù)保存在對象里面,直接給子組件的屬性或vuex存儲一個對象就行了。

3、模塊化開發(fā)、模塊化更新

就像第二點所說的,其實可以引申到模塊化開發(fā)。比如一個列表頁面里面有添加功能,有修改功能,這時候我們可以通過引用子組件的形式,當子組件內容更新的時候,修改主組件的數(shù)據(jù),比如修改了一條數(shù)據(jù)后,我們需要列表頁同時刷新,但我們不希望改變原來列表頁的頁碼和搜索條件。假如你用原生開發(fā)來實現(xiàn)這個,需要寫很多業(yè)務邏輯保存上一個頁面的搜索條件和頁碼這些參數(shù),但假如你用vue開發(fā),將變得非常簡單。

4、代碼可讀性

vue天生具有組件化開發(fā)的能力,因此不同的功能基本都是寫在不同的模塊里面,因此代碼的可讀性非常高。當一個新手接手一個舊項目的時候,基本上可以做到一到兩天就能定位到要修改的代碼,進行修改。

5、基于強大的nodejs,添加新的組件庫,基本一句npm命令就能安裝,比如當我需要使用axios組件的時候,直接npm install axios安裝一下,就可以使用axios這個組件。熟悉maven的同學估計很容易就能理解npm工具。

6、主路由、子路由、主頁面、子組件的方式,可以讓我們徹底拋棄iframe。寫過前端的同學都知道,因為iframe的滾動條、和子頁面跟其他頁面的交互性這些原因、用戶體驗還是遠遠沒有單頁面架構友好。而且使用vue非常簡單方便的實現(xiàn)系統(tǒng)菜單、導航等固定布局。

7、css模塊化:各個組件之間,可以使用相同的樣式名,但有不同的樣式屬性。比如組件A和組件B的button都綁定了class="btn", 但在兩個組件里,我們可以實現(xiàn)兩個不同的btn樣式屬性,互不影響。

讀到這里,這篇“vue的優(yōu)缺點有哪些”文章已經(jīng)介紹完畢,想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會,如果想了解更多相關內容的文章,歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

分享名稱:vue的優(yōu)缺點有哪些
本文URL:http://bm7419.com/article34/phogse.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站制作、網(wǎng)站維護、靜態(tài)網(wǎng)站、用戶體驗、網(wǎng)站制作

廣告

聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)站建設公司