在微信中是要這樣調用的：

就會返回下面的結果：

看來這個名為wx-map的標簽就是微信下的map標簽，它是wx-page的children。然后讓我們在WAWebview中搜索一下，就會發現一個很有意思的代碼:

它的behaviors中有一句：wx-native，這莫非就是傳說中的native組件：

順便再看一個video是不是也是一樣的：

好了，你那么聰明，我就這么說一半好了，剩下你自己去猜。

可以肯定的是：

• map標簽在開發的時候會變成HTML + CSS

• map標簽在微信上可以使用類似于Cordova的形式調用 Native組件

再接著說，virtual dom的事，回到示例代碼里的map.js:

js里只放置了data，剩下的都是依據上面的值變動的observer，如：

• _updatePosition

• _hiddenChanged

• latitudeChanged

• longitudeChanged

• scaleChanged

• coversChanged

• ...

這種代碼的感覺比React更進了一步的節奏，本來你還需要編碼來觀察state，現在只需要state變動了就可以了。。。23333....，你們這些程序員都會被fire的。

好了，這里差不多就這樣了~~。

重新審視WXWebview.js

于是，我重新逛逛WXWebview.js，發現這個文件里面不只有component的內容，還有：

• reportSDK

• webviewSDK ??

• virtual_dom

• exparser

• wx-components.js

• wx-components.css

等等，你是不是已經猜到我在說什么了，上一篇中我們說到了PageFrame：

在之前的想法里，我覺得我必須要集齊上面的SDK，才能招喚中神龍。后來，我看到了這句：

如果不是開發環境就使用WAWebview.js，在開發環境中使用使用xxSDK，那么生產環境是怎么回事？如果是在開發環境會去下載最新的SDK，好像不對~~，哈哈。。

我猜這部分，我需要一個內測id，才能猜出這個答案。

有意思的是，IDE會對比version.json，然后去獲取最新的，用于預覽或者區分對待開發者？

上面已經解釋清楚了WAWebview的功能了，那么WAService.js呢——就是封裝那些API的，如downloadFile：

這一點上仍然相當有趣，在我們開發的時候仍然是WAWebview做了相當多的事，而它和WAService的打包是分離的。

那么，我們從理論上來說，只需要有WAWebview就可以Render頁面了。

好了，那么問題來了，如何在瀏覽器上運行呢？

小程序開發者交流 131894955

總結

以上是生活随笔為你收集整理的「微信小程序」剖析（二）：框架原理 | 在桌面浏览器上运行的的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。