您好,登錄后才能下訂單哦!
這篇文章主要介紹了使用vue.js需要注意哪些事項(xiàng),具有一定借鑒價(jià)值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
使用vue.js需要注意:1、過濾器主要用于簡(jiǎn)單的文本轉(zhuǎn)換;2、computed和methods的區(qū)別;3、key的使用;4、數(shù)組的使用;5、組件的使用;6、組件通信。
使用vue.js需要注意以下問題:
1、過濾器主要用于簡(jiǎn)單的文本轉(zhuǎn)換,如果要實(shí)現(xiàn)復(fù)雜的數(shù)據(jù)變換,應(yīng)使用計(jì)算屬性
2、指令的使用
v-bind基本用于HTML元素上的屬性,如id、class、href、src等
v-on用來綁定事件監(jiān)聽器,如click、dblclick、keyup、mousemove等,method內(nèi)的this指向的是當(dāng)前Vue實(shí)例
v-show不能使用在template上
- v-if 和 v-show使用場(chǎng)景
v-if 條件為false則不會(huì)編譯渲染元素。v-show只是簡(jiǎn)單的CSS屬性切換,無論true/false,都會(huì)編譯。v-if適合條件不常改變的場(chǎng)景v-show適用頻繁切換條件
3、computed和methods的區(qū)別
methods有括號(hào)(),computed不帶括號(hào)。
computed是基于它的依賴緩存,只有相關(guān)依賴發(fā)生改變時(shí)才會(huì)重新取值。
methods在重新渲染的時(shí)候,函數(shù)總會(huì)重新調(diào)用執(zhí)行。
4、key的使用
Vue渲染元素時(shí),考慮效率,會(huì)盡可能復(fù)用已有的元素。此時(shí)需要在被重用的元素加上key屬性
<input key="go">
5、數(shù)組的使用
filter()、concat()、slice()不會(huì)更改原數(shù)組,將返回一個(gè)新數(shù)組
用新數(shù)組替換原數(shù)組,無性能影響。Vue渲染時(shí),會(huì)盡量復(fù)用DOM元素
部分?jǐn)?shù)組變動(dòng)無法被Vue檢測(cè)到,并更新視圖
app.books[3]={}app.books.length=1以上情況可以分別使用Vue.set和app.books.splice(1)處理
6、組件的使用
<table>、<ul>、<ol>、<select>等標(biāo)簽受HTML限制,只允許出現(xiàn)限制的標(biāo)簽,自定義的組件標(biāo)簽是無效的。
這時(shí)候可以使用is屬性掛載組件
<table> <tbody is="my-component"></tbody> </table>
<tbody>渲染時(shí)會(huì)替換為組件my-component的內(nèi)容
注:但使用字符串模板時(shí),不受限。如.vue文件
7、組件通信
父->子 prop
子->父 $emit v-model
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享使用vue.js需要注意哪些事項(xiàng)內(nèi)容對(duì)大家有幫助,同時(shí)也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,遇到問題就找億速云,詳細(xì)的解決方法等著你來學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。