egg.js源碼解析之render()


作為阿里的開源node.js框架,我覺得egg.js是很有前途的,故而學之,github上down了一個項目下來(https://github.com/easy-team/egg-vue-webpack-boilerplate),這是個基於 Egg + Vue + Webpack 多頁面和單頁面服務端渲染同構工程骨架項目,稍作學習大致有了了解,但是會用並不是目的!!!

egg.js采用了傳統的MVC架構,那么今天我們就來結合demo來看看egg.js是如何實現視圖渲染的。

如你所見,上圖就是應用首頁的Controller文件,通過render函數渲染之后得到如下視圖;

那么這個render()函數到底做了什么事呢?

(剛開始的話,因為想到egg繼承koa嘛,我就去koa下找context去了,確實走了一些彎路),so,我們來看看上圖標出的那兩個文件:

所以最后,是一個ContextView實例的render函數:

上面有一些中括號加常量形式的東西,他是一個Symbel對象,你可以直接把他看做一個符號,亦或是acb、rwf、cl(下一篇介紹Symbel);

至此,我們看看最終執行的這個函數:

你可能會問,哪來的視圖引擎,來一張官網的截圖感受一下:

 

看了這么多,其實和我們正常思路預想的一樣,就是把視圖和數據結合起來嘛,用到了模板引擎而已,那這源碼看了有什么作用么?

學到了什么呢?乍一看,啥都沒學到,但是在看這些的時候,由於對Symbol的應用方面原本不是很熟,就去查資料啊,到最后,加深了對Symbol的認識。

所以,知識本就是一環套一環的。

下節講解Symbol的應用。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM