本技術(shù)涉及前端開發(fā)，特別涉及一種網(wǎng)頁視圖刷新方法、裝置、電子設(shè)備及存儲介質(zhì)。

背景技術(shù)：

1、目前，傳統(tǒng)的html(超文本標(biāo)記語言)網(wǎng)頁刷新方法主要包括以下兩種方式：

2、1)借助webbrowser，jsoup或chromium這類控件，加載解析html頁面后，使用控件提供的api方法，操作html頁面的元素完成應(yīng)用數(shù)據(jù)的顯示刷新和接收用戶的輸入。

3、2)通過寄宿在html頁面中的javascript腳本語言，操作頁面dom的元素來完成應(yīng)用數(shù)據(jù)的顯示刷新和接收用戶的輸入。

4、傳統(tǒng)的html網(wǎng)頁刷新方法會帶來嚴重的強耦合問題，即應(yīng)用數(shù)據(jù)和html頁面節(jié)點之間的強耦合問題，例如，應(yīng)用程序需要手動操作數(shù)據(jù)在html頁面上的顯示，并在數(shù)據(jù)變化后刷新html頁面上對應(yīng)的節(jié)點，一旦html頁面變更后，應(yīng)用程序也要同步修改對應(yīng)代碼，導(dǎo)致網(wǎng)頁刷新效率低并給代碼可維護性帶來巨大挑戰(zhàn)。

技術(shù)實現(xiàn)思路

1、本技術(shù)實施例的主要目的在于提出一種網(wǎng)頁視圖刷新方法、裝置、電子設(shè)備及存儲介質(zhì)，能夠解決應(yīng)用數(shù)據(jù)與視圖頁面之間的強耦合問題，提高網(wǎng)頁刷新效率。

2、一方面，本技術(shù)實施例提出了一種網(wǎng)頁視圖刷新方法，所述方法包括以下步驟：

3、獲取目標(biāo)網(wǎng)頁對應(yīng)的文檔對象模型樹和視圖頁面；

4、解析所述文檔對象模型樹，確定所述目標(biāo)網(wǎng)頁對應(yīng)的數(shù)據(jù)綁定信息；

5、獲取預(yù)設(shè)的數(shù)據(jù)模型，根據(jù)所述數(shù)據(jù)綁定信息和所述數(shù)據(jù)模型，建立所述視圖頁面對應(yīng)的視圖模型；

6、響應(yīng)于數(shù)據(jù)更新操作，獲取操作數(shù)據(jù)，利用所述視圖模型根據(jù)所述操作數(shù)據(jù)動態(tài)刷新所述視圖頁面。

7、在一些實施例中，所述解析所述文檔對象模型樹，確定所述目標(biāo)網(wǎng)頁對應(yīng)的數(shù)據(jù)綁定信息，具體包括：

8、解析所述文檔對象模型樹，確定多個頁面節(jié)點并獲取各所述頁面節(jié)點對應(yīng)的數(shù)據(jù)綁定信息；

9、根據(jù)各所述頁面節(jié)點對應(yīng)的所述數(shù)據(jù)綁定信息，確定各所述頁面節(jié)點對應(yīng)的數(shù)據(jù)綁定對象。

10、在一些實施例中，所述獲取預(yù)設(shè)的數(shù)據(jù)模型，根據(jù)所述數(shù)據(jù)綁定信息和所述數(shù)據(jù)模型，建立所述視圖頁面對應(yīng)的視圖模型，具體包括：

11、構(gòu)建所述視圖模型；

12、解析各所述頁面節(jié)點對應(yīng)的數(shù)據(jù)綁定對象，確定各所述頁面節(jié)點對應(yīng)的數(shù)據(jù)綁定源對象和數(shù)據(jù)綁定節(jié)點對象；

13、根據(jù)各所述頁面節(jié)點對應(yīng)的所述數(shù)據(jù)綁定源對象和所述數(shù)據(jù)綁定節(jié)點對象，生成數(shù)據(jù)綁定對象列表，根據(jù)所述數(shù)據(jù)綁定對象列表，建立所述視圖模型；

14、確定各所述數(shù)據(jù)綁定源對象在所述數(shù)據(jù)模型中對應(yīng)的數(shù)據(jù)存儲綁定接口，將各所述數(shù)據(jù)綁定源對象對應(yīng)的所述數(shù)據(jù)存儲綁定接口與所述視圖模型進行綁定。

15、在一些實施例中，所述響應(yīng)于數(shù)據(jù)更新操作，獲取操作數(shù)據(jù)，利用所述視圖模型根據(jù)所述操作數(shù)據(jù)動態(tài)刷新所述視圖頁面，具體包括：

16、響應(yīng)于第一數(shù)據(jù)更新操作，獲取第一操作數(shù)據(jù)，利用所述視圖模型所述第一操作數(shù)據(jù)，同步更新所述數(shù)據(jù)模型并動態(tài)刷新所述視圖頁面，其中，所述第一數(shù)據(jù)更新操作為用戶在所述視圖頁面中進行的數(shù)據(jù)更新操作；

17、響應(yīng)于第二數(shù)據(jù)更新操作，獲取第二操作數(shù)據(jù)，根據(jù)所述第二操作數(shù)據(jù)更新所述數(shù)據(jù)模型，利用所述視圖模型根據(jù)更新后的數(shù)據(jù)模型，動態(tài)刷新所述視圖頁面，其中，所述第二數(shù)據(jù)更新操作為用戶在所述數(shù)據(jù)模型中進行的數(shù)據(jù)更新操作。

18、在一些實施例中，所述響應(yīng)于第一數(shù)據(jù)更新操作，獲取第一操作數(shù)據(jù)，利用所述視圖模型所述第一操作數(shù)據(jù)，同步更新所述數(shù)據(jù)模型并動態(tài)刷新所述視圖頁面，具體包括：

19、獲取所述第一操作數(shù)據(jù)，利用所述視圖模型從多個所述數(shù)據(jù)綁定對象中確定所述第一操作數(shù)據(jù)對應(yīng)的目標(biāo)數(shù)據(jù)綁定對象，根據(jù)所述目標(biāo)數(shù)據(jù)綁定對象，確定目標(biāo)節(jié)點對象，所述目標(biāo)節(jié)點對象為所述目標(biāo)數(shù)據(jù)綁定對象對應(yīng)的所述數(shù)據(jù)綁定節(jié)點對象；

20、利用所述視圖模型根據(jù)所述第一操作數(shù)據(jù)，更新所述目標(biāo)節(jié)點對象對應(yīng)的節(jié)點綁定顯示數(shù)據(jù)，根據(jù)更新后的節(jié)點綁定顯示數(shù)據(jù)，動態(tài)刷新所述視圖頁面。

21、在一些實施例中，所述響應(yīng)于第二數(shù)據(jù)更新操作，獲取第二操作數(shù)據(jù)，根據(jù)所述第二操作數(shù)據(jù)更新所述數(shù)據(jù)模型，利用所述視圖模型根據(jù)更新后的數(shù)據(jù)模型，動態(tài)刷新所述視圖頁面，具體包括：

22、從多個所述數(shù)據(jù)綁定對象中確定所述第二操作數(shù)據(jù)對應(yīng)的目標(biāo)數(shù)據(jù)綁定對象，根據(jù)所述目標(biāo)數(shù)據(jù)綁定對象，確定目標(biāo)源對象和目標(biāo)節(jié)點對象，所述目標(biāo)源對象為所述目標(biāo)數(shù)據(jù)綁定對象對應(yīng)的所述數(shù)據(jù)綁定源對象，所述目標(biāo)節(jié)點對象為所述目標(biāo)數(shù)據(jù)綁定對象對應(yīng)的所述數(shù)據(jù)綁定節(jié)點對象；

23、根據(jù)所述第二操作數(shù)據(jù)，動態(tài)更新所述目標(biāo)源對象在所述數(shù)據(jù)模型中的目標(biāo)綁定數(shù)據(jù)，利用所述視圖模型通過所述目標(biāo)源對象對應(yīng)的所述數(shù)據(jù)存儲綁定接口，獲取更新后的目標(biāo)綁定數(shù)據(jù)；

24、利用所述視圖模型根據(jù)更新后的目標(biāo)綁定數(shù)據(jù)，動態(tài)更新所述目標(biāo)節(jié)點對象在所述視圖頁面中對應(yīng)的節(jié)點綁定顯示數(shù)據(jù)。

25、在一些實施例中，在執(zhí)行所述響應(yīng)于第一數(shù)據(jù)更新操作，獲取第一操作數(shù)據(jù)，利用所述視圖模型所述第一操作數(shù)據(jù)，同步更新所述數(shù)據(jù)模型并動態(tài)刷新所述視圖頁面時，還包括步驟：

26、根據(jù)所述目標(biāo)數(shù)據(jù)綁定對象，確定目標(biāo)源對象，所述目標(biāo)源對象為所述目標(biāo)數(shù)據(jù)綁定對象對應(yīng)的所述數(shù)據(jù)綁定源對象；

27、利用所述視圖模型根據(jù)所述第一操作數(shù)據(jù)，通過所述目標(biāo)源對象對應(yīng)的所述數(shù)據(jù)存儲綁定接口，動態(tài)更新所述目標(biāo)源對象在所述數(shù)據(jù)模型中的目標(biāo)綁定數(shù)據(jù)。

28、另一方面，本技術(shù)實施例提出了一種網(wǎng)頁視圖刷新裝置，所述裝置包括：

29、第一模塊，用于獲取目標(biāo)網(wǎng)頁對應(yīng)的文檔對象模型樹和視圖頁面；

30、第二模塊，用于解析所述文檔對象模型樹，確定所述目標(biāo)網(wǎng)頁對應(yīng)的數(shù)據(jù)綁定信息；

31、第三模塊，用于獲取預(yù)設(shè)的數(shù)據(jù)模型，根據(jù)所述數(shù)據(jù)綁定信息和所述數(shù)據(jù)模型，建立所述視圖頁面對應(yīng)的視圖模型；

32、第四模塊，用于響應(yīng)于數(shù)據(jù)更新操作，獲取操作數(shù)據(jù)，利用所述視圖模型根據(jù)所述操作數(shù)據(jù)動態(tài)刷新所述視圖頁面。

33、另一方面，本技術(shù)實施例提出了一種電子設(shè)備，所述電子設(shè)備包括存儲器和處理器，所述存儲器存儲有計算機程序，所述處理器執(zhí)行所述計算機程序時實現(xiàn)前面所述的網(wǎng)頁視圖刷新方法。

34、另一方面，本技術(shù)實施例提出了一種計算機可讀存儲介質(zhì)，所述計算機可讀存儲介質(zhì)存儲有計算機程序，所述計算機程序被處理器執(zhí)行時實現(xiàn)前面所述的網(wǎng)頁視圖刷新方法。

35、本技術(shù)實施例至少包括以下有益效果：本技術(shù)提供的一種網(wǎng)頁視圖刷新方法、裝置、電子設(shè)備及存儲介質(zhì)，其通過獲取目標(biāo)網(wǎng)頁對應(yīng)的文檔對象模型樹和視圖頁面；解析文檔對象模型樹，確定目標(biāo)網(wǎng)頁對應(yīng)的數(shù)據(jù)綁定信息；獲取預(yù)設(shè)的數(shù)據(jù)模型，根據(jù)數(shù)據(jù)綁定信息和數(shù)據(jù)模型，建立視圖頁面對應(yīng)的視圖模型；響應(yīng)于數(shù)據(jù)更新操作，獲取操作數(shù)據(jù)，利用視圖模型根據(jù)操作數(shù)據(jù)動態(tài)刷新視圖頁面。本技術(shù)能夠?qū)崿F(xiàn)網(wǎng)頁視圖動態(tài)刷新，能夠解決應(yīng)用數(shù)據(jù)與視圖頁面之間的強耦合問題，使得數(shù)據(jù)模型、視圖模型和視圖頁面三者之間是松散耦合關(guān)系，提高網(wǎng)頁刷新效率，提升代碼的可維護性。