java render

java render是什么？讓我們一起來了解一下吧！

Java render是是組件渲染的重要內(nèi)容，render函數(shù)與template模板開發(fā)一樣，只不過這種方式的開發(fā)，render更比較接近底層，這樣便可以使Vue編譯時少轉(zhuǎn)換一次。

一.render函數(shù)的返回數(shù)值是一個VNode -> "virtual node"虛擬節(jié)點(diǎn)

二.render函數(shù)的參數(shù)是一個createElement函數(shù)

三．createElement 函數(shù)的參數(shù)（三個）

實(shí)戰(zhàn)演練，具體步驟如下所示：

?/**
??*?render:?渲染函數(shù)
??*?參數(shù):?createElement
??*?參數(shù)類型:?Function
?*/
?render:?function?(createElement)?{
???let?_this?=?this['$options'].parent?//?我這個是在?.vue?文件的?components?中寫的，這樣寫才能訪問this
???let?_header?=?_this.$slots.header????//?$slots:?vue中所有分發(fā)插槽，不具名的都在default里
?
???/**
????*?createElement?本身也是一個函數(shù)，它有三個參數(shù)
????*?返回值:?VNode，即虛擬節(jié)點(diǎn)
????*?1.?一個?HTML?標(biāo)簽字符串，組件選項(xiàng)對象，或者解析上述任何一種的一個?async?異步函數(shù)。必需參數(shù)。{String?|?Object?|?Function}?-?就是你要渲染的最外層標(biāo)簽
????*?2.?一個包含模板相關(guān)屬性的數(shù)據(jù)對象你可以在?template?中使用這些特性。可選參數(shù)。{Object}?-?1中的標(biāo)簽的屬性
????*?3.?子虛擬節(jié)點(diǎn)?(VNodes)，由?`createElement()`?構(gòu)建而成，也可以使用字符串來生成“文本虛擬節(jié)點(diǎn)”。可選參數(shù)。{String?|?Array}?-?1的子節(jié)點(diǎn)，可以用?createElement()?創(chuàng)建，文本節(jié)點(diǎn)直接寫就可以
????*/
???return?createElement(???????
?????//?1.?要渲染的標(biāo)簽名稱：第一個參數(shù)【必需】??????
?????'div',???
?????//?2.?1中渲染的標(biāo)簽的屬性，詳情查看文檔：第二個參數(shù)【可選】
?????{
???????style:?{
?????????color:?'#333',
?????????border:?'1px?solid?#ccc'
???????}
?????},
?????//?3.?1中渲染的標(biāo)簽的子元素數(shù)組：第三個參數(shù)【可選】
?????[
???????'text',???//?文本節(jié)點(diǎn)直接寫就可以
???????_this.$slots.default,??//?所有不具名插槽，是個數(shù)組
???????createElement('div',?_header)???//?createElement()創(chuàng)建的VNodes
?????]
???)
?}

以上就是小編今天的分享了，希望可以幫助到大家。