2011-02-24 57 views
2

有沒有人知道是否可以將dojo小部件(dijit)對象序列化/反序列化爲字符串或可以在瀏覽器會話中保留的某種表示形式?是否可以序列化/反序列化dojo小部件對象?

我的場景: 我有一個帶有各種dijits的網頁,我希望能夠在新的瀏覽器會話中獲取「快照」並進行還原,從而使所有內容恢復到完全相同的狀態。 爲了做到這一點,我相信我需要序列化/恢復頁面的DOM樹以及dijit對象。我已經能夠序列化DOM樹,並且正在通過替換頁面的HTML節點的內容來恢復它。當頁面的DOM被恢復時,沒有一個dijits能夠正常工作 - 它們被正確渲染,但是你不能點擊它們中的任何一個。我相信這是因爲dojo解析器已經在頁面第一次加載時通過DOM運行,並且替換整個HTML DOM元素破壞了該頁面的dijit註冊表中的所有dijits ..這意味着dijit類必須重新創建,實例化。

理想情況下,我希望能夠做的是當我拍攝「快照」,將包含在頁面的dijit.registry中的每個dijit對象序列化爲文件,以及會話恢復時,重新構建這些dijit對象並將它們添加回dijit註冊表。

是這樣的: dijit.registry.forEach(功能(插件){? //保存部件對象,以便它可以在一個新的瀏覽器實例被恢復 });

有沒有人試過這個或知道如果沒有寫一個自定義序列化程序是可能的?

回答

1

我不確定我是否同意您使用的技術。更好的方案是簡單地序列化每個dijit的數據狀態。我知道這會做更多的工作,但是你試圖保持數據的狀態,把UI帶到一起似乎是保留了不必要的信息。

也就是說,dojo解析器可以獨立於頁面加載進行調用。你所尋找的是

dojo.parser.parse(); 

運行,你重新填充後的innerHTML應該重新分析並重新創建的dijits 爲完整的參考見本頁面:http://docs.dojocampus.org/dojo/parser

+0

以下是我將執行您建議的解決方案的過程: 1)不是序列化整個dijit對象,而是僅序列化恢復dijit狀態所必需的屬性。 (跳過函數和循環引用) 2)重新填充DOM樹時,運行dojo.parser.parse()以重新實例化所有dijits。 3)反序列化的dijit信息和每個dijit \t - 確定 - 根據類型類型 \t,對dijit的調用方法,以恢復其狀態(你只能通過方法調用修改的dijit的狀態) – treaint 2011-02-25 19:50:52

+0

步驟2後顧之憂我:當解析器重新解析頁面時,它會修改每個dijit所連接的DOM元素的屬性? (因爲dijit被重新實例化爲「新」狀態) 步驟3將很難實現。我需要基於dijit類型和特定的屬性名稱來映射需要調用哪些方法。 例如,如果小部件是一個dijit.form.textbox,並且該屬性是{value:「First Name」} 我需要採取這兩條信息並決定調用dijit.form.textbox.set( (顯示值),'名字') – treaint 2011-02-25 19:51:54

0

任何JavaScript對象(包括Dojo小部件)可以使用dojo.toJson(),序列化JSON成如:

var deserialisedValue = dojo.toJson(myObject); 
+0

dijit.registry.forEach(function(w){ console.log(dojo.toJson(w)); }); 拋出「無法序列化DOM節點」異常 – treaint 2011-03-05 16:41:55

+0

即使這樣做工作你如何建議反序列化它?參見:http://stackoverflow.com/questions/22945894/dojo-how-to-load-an-object-containing-other-objects-from-json – sixtyfootersdude 2014-04-08 19:04:47

0

我的猜測是,我們可以序列化和反序列化Dojo小部件,但店(也是商店的類型)上這些小部件是BUIL t也應該被序列化和反序列化。 這可能涉及使用eval語句,這被認爲是邪惡的。我還認爲事件處理程序,這些小部件訂閱的主題可能不會被序列化和反序列化。

0

如果收件人頁(其中的dijits將反序列化)具有相同數量的小工具,最簡單的解決辦法是換行的一切了dijit/form/Form內,並呼籲valueJSON = form.get('value')序列化並form.set('value', valueJSON)到deserialise。

對於類似於dgrid和圖表等窗體中的小部件,它變得更加棘手。你將不得不採取一個小部件特定的方法。例如:通過調用grid.save(),然後調用JSON.stringify (grid.get('store')),可以輕鬆地序列化其值已更改的dgrid。

櫃面deserialisation頁面都可以有小部件的任意電話號碼,我同意@treaint你可以去通過widget.get('declaredClass') \\Returns TextBox etc.

越來越小部件的類型,我們也有類似的問題,但我們與形式的解決了這個問題很容易獲得/設定值!它非常巧妙,它遍歷所有的孩子,在每一個孩子身上調用child.get('value'),並將其與自己的價值混合在一起。