Vue 高效開發 實踐 二

2021-10-04 19:32:53 字數 1104 閱讀 5864

render函式使得我們可以以程式的邏輯去建立元件,其實在最後也是要被編譯成createelement的函式去執行,建立得到vnode的。

官網的例子

當開始寫乙個只能通過 level prop 動態生成標題 (heading) 的元件時,你可能很快想到這樣實現:

"level === 1"

>

<

/slot>

<

/h1>

else-if

="level === 2"

>

<

/slot>

<

/h2>

else-if

="level === 3"

>

<

/slot>

<

/h3>

else-if

="level === 4"

>

<

/slot>

<

/h4>

else-if

="level === 5"

>

<

/slot>

<

/h5>

else-if

="level === 6"

>

<

/slot>

<

/h6>

<

/template>

但其實這樣是不太優雅的寫法,我們可以很好的利用render函式:

export

default},

render:

function

(createelement)

};

同時也可以使用jsx語法,jsx語法在本質上也會被轉化為createelement語句,只不過使用起來更方便。

jsx 寫法

export

default},

render:

function

(h)`

;return

<

/tag>;}

};

Web前端高效開發總結二 HTML最佳實踐

標準html 的重要性 標準的html 指的是html 符合w3c的最新標準,對於乙個標準的頁面來說,具有的優點有 1.標準的頁面能保證瀏覽器正確的渲染 2.網頁能更容易被搜尋引擎搜尋,提高 的搜尋排名,爬蟲的目的是讀懂 的內容,並找出 中的關鍵字 4.能更好的被維護和擴充套件 在w3c上提供了一項...

vue如何高效使用

一 如何讓自己的 看起來舒服 1 個人理解,在專案中,首先coding style是必須的。2 為了便於維護,新建乙個api層,專門用來封裝對後台的請求 3 使用store的時候,看專案的大小,若小的話可以不使用module,actions專門用來處理api請求。4 新建乙個util,專門用來封裝用...

Android高效開發

android高效開發 原則 1.不要做不必要的事情,2盡可能節省記憶體使用 盡可能避免建立物件 使用自身的方法,如string.indexof string.lastindexof 乘虛自身的方法 使用虛擬優於使用介面。在嵌入式開發中,通過介面引用來呼叫會花費2倍於虛擬的時間,如map map1 ...