日本综合一区二区|亚洲中文天堂综合|日韩欧美自拍一区|男女精品天堂一区|欧美自拍第6页亚洲成人精品一区|亚洲黄色天堂一区二区成人|超碰91偷拍第一页|日韩av夜夜嗨中文字幕|久久蜜综合视频官网|精美人妻一区二区三区

不知您是否熟悉、或正在使用著Vue.js。總的說來，Vue是用來設(shè)計(jì)用戶界面的漸進(jìn)式框架。與其他框架不同，它在設(shè)計(jì)之初就充分考慮到了增量適應(yīng)性(incremental adaptability)。Vue的核心庫都主要集中并關(guān)注視圖層。它不僅容易上手，還便于與第三方的庫、以及既有項(xiàng)目相集成。同時(shí)，Vue生態(tài)系統(tǒng)所支持的庫在與單文件組件(SFC)等工具結(jié)合使用時(shí)，Vue也能夠?yàn)閺?fù)雜的單頁應(yīng)用提供相應(yīng)的驅(qū)動與功能。

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

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

優(yōu)點(diǎn)：

• 代碼具有一定的可讀性
• 提供豐富的文獻(xiàn)與支持資料
• 具有適應(yīng)性和反應(yīng)性
• 框架本身體積不大
• 具體較強(qiáng)的靈活性

缺點(diǎn)：

• 社區(qū)規(guī)模較小

雖然優(yōu)勢大于劣勢，但是由于大多數(shù)開發(fā)人員未能遵循Vue.js的優(yōu)秀實(shí)踐(請參見-- https://levelup.gitconnected.com/best-practices-for-vue-js-b46760fe0096)，因此他們不僅無法充分利用Vue.js的全部潛能，而且可能時(shí)常犯錯(cuò)。

就個(gè)人而言，我已經(jīng)使用Vue.js一段時(shí)間了，除了收獲愉快的體驗(yàn)與經(jīng)驗(yàn)，也曾犯過一些錯(cuò)誤。為了避免大家跌入同樣的“坑”中，我在此將其中常見的七大錯(cuò)誤總結(jié)如下：

1.添加模板編譯器

在嘗試導(dǎo)入Vue.js時(shí)，我發(fā)現(xiàn)：即使自己遵循了官方指南的說明事項(xiàng)，組件的內(nèi)聯(lián)(inline)模板也會返回空白頁面。對此，當(dāng)我試著使用那些渲染函數(shù)(render function)、或作為單文件組件定義的模板時(shí)，此類問題就沒有再現(xiàn)了。由于Vue具有許多個(gè)不同的版本，因此我估計(jì)這是由版本差異所導(dǎo)致的。畢竟，NPM軟件包所導(dǎo)出的默認(rèn)構(gòu)建版本，通常是僅用于構(gòu)建運(yùn)行時(shí)(runtime)，并不包括模板的編譯器。

如果您熟悉JSX for React，那么就不難理解模板編譯器了。它的作用是通過函數(shù)調(diào)用的方式，僅替換那些模板字符串，進(jìn)而創(chuàng)建一個(gè)虛擬的DOM節(jié)點(diǎn)。該問題未在單文件組件中發(fā)生的主要原因是：單文件組件使用了vue-loader和vueify工具。這兩個(gè)工具都能夠通過使用渲染函數(shù)所定義的模板，來生成簡單的JavaScript組件。因此，要避免該問題，您需要在導(dǎo)入期間指定正確的構(gòu)建版本。當(dāng)然，您也可以通過在捆綁程序的配置中，為Vue創(chuàng)建別名(alias)，來解決此類問題。

2.維持屬性的反應(yīng)性

React用戶一定對反應(yīng)性的概念并不陌生。它是通過調(diào)用setState函數(shù)來工作的。此函數(shù)能夠更新各種屬性值。盡管反應(yīng)性也是Vue.js的一大優(yōu)點(diǎn)，但它在Vue中的工作方式與在React中有所不同。在Vue中，它代理的是各種組件的屬性。用于覆蓋和更新的Get和Set函數(shù)，在虛擬的DOM中被傳遞。 

 
 
 
 

  
  
  
  
var vm = new Vue({ 
  
  
  
  
  el: '#vm', 
  
  
  
  
  template: `
{{ item.count }}
`, 
  
  
  
  
  data: { 
  
  
  
  
    item: {} 
  
  
  
  
  }, 
  
  
  
  
  beforeMount () { 
  
  
  
  
    this.$data.item.count = 0;   
  
  
  
  
  }, 
  
  
  
  
  methods: { 
  
  
  
  
    updateCount () { 
  
  
  
  
      // JavaScript object is updated but 
  
  
  
  
      // the component template is not rendered again 
  
  
  
  
      this.$data.item.count++; 
  
  
  
  
    } 
  
  
  
  
  }  
  
  
  
  
});  
 
 
 
 

在上述Java代碼示例中，您可以清楚地看到Vue實(shí)例具有一個(gè)名為item的屬性，其中包含著一個(gè)空對象。在組件被初始化后，Vue會創(chuàng)建一個(gè)代理，該代理具有與item屬性相連接的get和set函數(shù)。據(jù)此，該框架會跟蹤各個(gè)值的變化，并做出相應(yīng)的反應(yīng)。

3.導(dǎo)出單文件組件

為了簡化JavaScript文件的復(fù)雜性，Vue使用了簡單的處置方法--單文件組件，它能夠?qū)⑺蠬TML、CSS和JavaScript代碼收集到同一個(gè)文件中。不過，由于單文件組件的代碼通常駐留在Vue文件內(nèi)部的script標(biāo)記中，因此即使代碼是由JavaScript編寫的，您仍然需要導(dǎo)出對應(yīng)的組件。當(dāng)然，您可以使用如下三種方法來實(shí)現(xiàn)：

• 直接導(dǎo)出
• 命名導(dǎo)出
• 默認(rèn)導(dǎo)出

如果選擇命名的導(dǎo)出方式，那么我們將無法對各個(gè)組件進(jìn)行重命名。而且更重要的是，命名導(dǎo)出與單文件組件并不兼容。因此，如果您是一名新手用戶，我建議您使用默認(rèn)的導(dǎo)出方法會更好。

4.避免合并單文件組件

由于單文件組件可以使開發(fā)人員在同一個(gè)文件中添加各種代碼、模板和樣式，因此它簡化了開發(fā)的整個(gè)過程。不過，為了避免產(chǎn)生混亂，我們應(yīng)按需分隔不同的單文件組件。新導(dǎo)入的單文件組件很可能會覆蓋過往的單文件組件，因此我們在合并它們的時(shí)候要倍加小心。此外，單文件組件最大的一個(gè)缺點(diǎn)是：我們不能將它們整體導(dǎo)入到多個(gè)Vue組件之中。

5. 父數(shù)據(jù)更新子組件

在Vue.js中，父組件會使用props或發(fā)送事件消息，將數(shù)據(jù)向下傳遞給子組件。而子組件也會做出響應(yīng)。這種關(guān)系往往被稱為props down和event up。如下代碼片段展示了父數(shù)據(jù)如何通過props傳遞給子元素：