本發(fā)明涉及數(shù)據(jù)處理領(lǐng)域，具體而言，涉及一種數(shù)據(jù)更新方法和裝置。

背景技術(shù)：

大屏幕監(jiān)控的數(shù)據(jù)需要多種多樣的可視化數(shù)據(jù)顯示，現(xiàn)有技術(shù)中一般采用React(一款用戶構(gòu)建用戶界面的Javascript庫)+Redux(應(yīng)用狀態(tài)管理服務(wù))的方式進(jìn)行可視化數(shù)據(jù)顯示，如圖1所示，該顯示方式的數(shù)據(jù)架構(gòu)中，用戶在屏幕上通過點(diǎn)擊鼠標(biāo)生成顯示事件，視圖提供模塊檢測到該顯示事件之后，響應(yīng)該顯示事件將對應(yīng)的用戶需求通過中間件傳輸至組件狀態(tài)管理單元，該組件狀態(tài)管理單元中包括多個(gè)功能模塊(每個(gè)頁面對應(yīng)一個(gè)業(yè)務(wù)邏輯)，用戶需求與業(yè)務(wù)邏輯建立關(guān)系之后，通過對應(yīng)的業(yè)務(wù)邏輯實(shí)現(xiàn)用戶需求，將對應(yīng)的數(shù)據(jù)顯示在屏幕上，以完成設(shè)備與用戶的交互或數(shù)據(jù)改動(dòng)。

其中，中間件(即middleware)是用于連接兩個(gè)獨(dú)立的應(yīng)用程序或系統(tǒng)的軟件，如建立用戶需求與業(yè)務(wù)邏輯之間的關(guān)系。

上述的React+Redux的顯示方式，從整體上看，數(shù)據(jù)的流動(dòng)是清晰的，但是，如上述分析，通過該顯示方式進(jìn)行數(shù)據(jù)交互或數(shù)據(jù)改動(dòng)時(shí)，依賴的模塊很多(如包括視圖提供模塊、中間件以及組件狀態(tài)管理單元)，數(shù)據(jù)源和數(shù)據(jù)接口很多，若需要引入新的組件，則需要重新編寫數(shù)據(jù)驅(qū)動(dòng)單元。

為了解決該問題，現(xiàn)有技術(shù)中提供了一種純樣式組件化數(shù)據(jù)驅(qū)動(dòng)開發(fā)模式，如圖2所示，該模塊化方案中，頁面中包括A模塊、B模塊和C模塊，A組件中包括模塊A1和模塊A2，B組件中包括模塊B1和模塊B2，C組件中包括模塊C1和模塊C101。在進(jìn)行數(shù)據(jù)通信時(shí)，若模塊B2中的數(shù)據(jù)發(fā)生事件1，則將該事件1反饋至頁面管理單元，頁面管理單元接收到該事件1觸發(fā)A組件中的模塊A2動(dòng)作，并通過A組件觸發(fā)C組件中的模塊C101動(dòng)作(該數(shù)據(jù)傳輸過程需通過模塊C1)，該種模塊化的數(shù)據(jù)交互方案中，業(yè)務(wù)邏輯封裝在組件和頁面管理單元中，一旦發(fā)生一個(gè)事件可能需要多個(gè)組件進(jìn)行響應(yīng)，并且這個(gè)過程中需要跨組件進(jìn)行通信。

在該方案中，跨組件之間存在邏輯耦合，跨組件通信邏輯混亂復(fù)雜，需要更新數(shù)據(jù)時(shí)，需要調(diào)用或封裝多個(gè)模塊的邏輯，更新效率低。

針對上述更新數(shù)據(jù)效率低的問題，目前尚未提出有效的解決方案。

技術(shù)實(shí)現(xiàn)要素：

本發(fā)明實(shí)施例提供了一種數(shù)據(jù)更新方法和裝置，以至少解決更新效率低的技術(shù)問題。

根據(jù)本發(fā)明實(shí)施例的一個(gè)方面，提供了一種數(shù)據(jù)更新方法，該方法包括：檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化，其中，所述統(tǒng)一數(shù)據(jù)源用于向所述頁面上的多個(gè)頁面組件提供數(shù)據(jù)，所述頁面組件用于根據(jù)提供的數(shù)據(jù)進(jìn)行頁面內(nèi)容的顯示；若檢測到所述統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入到所述多個(gè)頁面組件中；響應(yīng)于傳入的所述更新后的數(shù)據(jù)，在所述多個(gè)頁面組件中對所述頁面內(nèi)容進(jìn)行更新顯示。

根據(jù)本發(fā)明實(shí)施例的另一方面，還提供了一種數(shù)據(jù)更新裝置，該裝置包括：檢測單元，用于檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化，其中，所述統(tǒng)一數(shù)據(jù)源用于向所述頁面上的多個(gè)頁面組件提供數(shù)據(jù)，所述頁面組件用于根據(jù)提供的數(shù)據(jù)進(jìn)行頁面內(nèi)容的顯示；傳輸單元，用于若檢測到所述統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入到所述多個(gè)頁面組件中；顯示單元，用于響應(yīng)于傳入的所述更新后的數(shù)據(jù)，在所述多個(gè)頁面組件中對所述頁面內(nèi)容進(jìn)行更新顯示。

在本發(fā)明實(shí)施例中，在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化之后，將更新后的數(shù)據(jù)傳入頁面組件中，并響應(yīng)該傳入的更新后的數(shù)據(jù)在頁面組件中更新顯示，以完成對數(shù)據(jù)的更新。在該方案中，利用統(tǒng)一數(shù)據(jù)源對頁面組件中的數(shù)據(jù)進(jìn)行管理，并且頁面組件響應(yīng)于該統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)進(jìn)行顯示，解除了頁面組件之間的邏輯耦合，在上述的數(shù)據(jù)更新過程中，各個(gè)頁面組件之間不需要進(jìn)行數(shù)據(jù)交互，將統(tǒng)一數(shù)據(jù)源的數(shù)據(jù)傳入頁面組件中，頁面組件響應(yīng)該傳入的數(shù)據(jù)直接進(jìn)行更新顯示，提高了數(shù)據(jù)更新的效率，解決了現(xiàn)有技術(shù)中更新效率低的技術(shù)問題。

附圖說明

此處所說明的附圖用來提供對本發(fā)明的進(jìn)一步理解，構(gòu)成本申請的一部分，本發(fā)明的示意性實(shí)施例及其說明用于解釋本發(fā)明，并不構(gòu)成對本發(fā)明的不當(dāng)限定。在附圖中：

圖1是根據(jù)現(xiàn)有技術(shù)中數(shù)據(jù)驅(qū)動(dòng)的數(shù)據(jù)流流向的示意圖；

圖2是根據(jù)現(xiàn)有技術(shù)中數(shù)據(jù)驅(qū)動(dòng)架構(gòu)的示意圖；

圖3是根據(jù)本發(fā)明實(shí)施例的數(shù)據(jù)更新方法的硬件環(huán)境的示意圖；

圖4是根據(jù)本發(fā)明實(shí)施例的一種可選的數(shù)據(jù)更新方法的流程圖；

圖5是根據(jù)本發(fā)明實(shí)施例的一種可選的數(shù)據(jù)驅(qū)動(dòng)架構(gòu)的示意圖；

圖6是根據(jù)本發(fā)明實(shí)施例的一種可選的統(tǒng)一數(shù)據(jù)源中樹狀關(guān)聯(lián)關(guān)系的示意圖；

圖7是根據(jù)本發(fā)明實(shí)施例的一種可選的應(yīng)用場景的界面示意圖；

圖8是根據(jù)本發(fā)明實(shí)施例的一種可選的數(shù)據(jù)傳入方式的示意圖；

圖9是根據(jù)本發(fā)明實(shí)施例的另一種可選的數(shù)據(jù)傳入方式的示意圖；

圖10是根據(jù)本發(fā)明實(shí)施例的一種可選的數(shù)據(jù)更新裝置的示意圖；以及

圖11是根據(jù)本發(fā)明實(shí)施例的一種終端的結(jié)構(gòu)框圖。

具體實(shí)施方式

為了使本技術(shù)領(lǐng)域的人員更好地理解本發(fā)明方案，下面將結(jié)合本發(fā)明實(shí)施例中的附圖，對本發(fā)明實(shí)施例中的技術(shù)方案進(jìn)行清楚、完整地描述，顯然，所描述的實(shí)施例僅僅是本發(fā)明一部分的實(shí)施例，而不是全部的實(shí)施例?；诒景l(fā)明中的實(shí)施例，本領(lǐng)域普通技術(shù)人員在沒有做出創(chuàng)造性勞動(dòng)前提下所獲得的所有其他實(shí)施例，都應(yīng)當(dāng)屬于本發(fā)明保護(hù)的范圍。

需要說明的是，本發(fā)明的說明書和權(quán)利要求書及上述附圖中的術(shù)語“第一”、“第二”等是用于區(qū)別類似的對象，而不必用于描述特定的順序或先后次序。應(yīng)該理解這樣使用的數(shù)據(jù)在適當(dāng)情況下可以互換，以便這里描述的本發(fā)明的實(shí)施例能夠以除了在這里圖示或描述的那些以外的順序?qū)嵤４送?，術(shù)語“包括”和“具有”以及他們的任何變形，意圖在于覆蓋不排他的包含，例如，包含了一系列步驟或單元的過程、方法、系統(tǒng)、產(chǎn)品或設(shè)備不必限于清楚地列出的那些步驟或單元，而是可包括沒有清楚地列出的或?qū)τ谶@些過程、方法、產(chǎn)品或設(shè)備固有的其它步驟或單元。

首先，在對本發(fā)明實(shí)施例進(jìn)行描述的過程中出現(xiàn)的部分名詞或者術(shù)語適用于如下解釋：

Vue框架：是數(shù)據(jù)驅(qū)動(dòng)的MVVM(Model-View-View Model，即模型-視圖-視圖-模型)框架，該框架是使用數(shù)據(jù)綁定的基礎(chǔ)框架，該框架是將視圖View和業(yè)務(wù)邏輯分離的架構(gòu)。

SDS：單一數(shù)據(jù)源(Single Data Source)，相當(dāng)于一個(gè)全局的模型對象Model，該模型對象用于在數(shù)據(jù)庫中存取數(shù)據(jù)，模型對象從數(shù)據(jù)庫中讀取的每一種數(shù)據(jù)狀態(tài)決定一種視圖View快照。其中，Model代表模型對象，該模型對象是應(yīng)用程序中用于處理應(yīng)用程序數(shù)據(jù)邏輯的部分，模型對象用于在數(shù)據(jù)庫中存取數(shù)據(jù)。具體地，單一數(shù)據(jù)源通過一個(gè)邏輯上單一的數(shù)據(jù)存儲(chǔ)實(shí)體，在分布于不同數(shù)據(jù)存儲(chǔ)系統(tǒng)中的文檔對象數(shù)據(jù)之間建立嚴(yán)格的約束，以保證各個(gè)數(shù)據(jù)存儲(chǔ)系統(tǒng)中的數(shù)據(jù)是一致完整的。

WeUI：網(wǎng)頁開發(fā)樣式庫。

實(shí)施例1

根據(jù)本發(fā)明實(shí)施例，提供了一種數(shù)據(jù)更新的方法實(shí)施例。

可選地，在本實(shí)施例中，上述數(shù)據(jù)更新方法可以應(yīng)用于如圖3所示的由服務(wù)器302和終端304所構(gòu)成的硬件環(huán)境中。如圖3所示，服務(wù)器302通過網(wǎng)絡(luò)與終端304進(jìn)行連接，上述網(wǎng)絡(luò)包括但不限于：廣域網(wǎng)、城域網(wǎng)或局域網(wǎng)，終端304并不限定于PC、手機(jī)、平板電腦等。本發(fā)明實(shí)施例的數(shù)據(jù)更新方法可以由服務(wù)器302來執(zhí)行，也可以由終端304來執(zhí)行，還可以是由服務(wù)器302和終端304共同執(zhí)行。其中，終端304執(zhí)行本發(fā)明實(shí)施例的數(shù)據(jù)更新方法也可以是由安裝在其上的客戶端來執(zhí)行。

圖4是根據(jù)本發(fā)明實(shí)施例的一種可選的數(shù)據(jù)更新方法的流程圖，如圖4所示，該方法可以包括以下步驟：

步驟S402，檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化，其中，統(tǒng)一數(shù)據(jù)源用于向頁面上的多個(gè)頁面組件提供數(shù)據(jù)，頁面組件用于根據(jù)提供的數(shù)據(jù)進(jìn)行頁面內(nèi)容的顯示；

步驟S404，若檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中；

步驟S406，響應(yīng)于傳入的更新后的數(shù)據(jù)，在多個(gè)頁面組件中對頁面內(nèi)容進(jìn)行更新顯示。

通過上述步驟S402至步驟S408，在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化之后，將更新后的數(shù)據(jù)傳入頁面組件中，并響應(yīng)該傳入的更新后的數(shù)據(jù)在頁面組件中更新顯示，以完成對數(shù)據(jù)的更新。在該方案中，利用統(tǒng)一數(shù)據(jù)源對頁面組件中的數(shù)據(jù)進(jìn)行管理，并且頁面組件響應(yīng)于該統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)進(jìn)行顯示，解除了頁面組件之間的邏輯耦合，在上述的數(shù)據(jù)更新過程中，各個(gè)頁面組件之間不需要進(jìn)行數(shù)據(jù)交互，將統(tǒng)一數(shù)據(jù)源的數(shù)據(jù)傳入頁面組件中，頁面組件響應(yīng)該傳入的數(shù)據(jù)直接進(jìn)行更新顯示，提高了數(shù)據(jù)更新的效率，解決了現(xiàn)有技術(shù)中更新效率低的技術(shù)問題。

上述的頁面組件可以包括表格、樹和聯(lián)動(dòng)下拉框等，不同的頁面組件可以具有不同的顯示風(fēng)格、顯示位置等。

在步驟S402提供的技術(shù)方案中，每個(gè)頁面對應(yīng)一個(gè)單一數(shù)據(jù)源，也即上述的頁面上的統(tǒng)一數(shù)據(jù)源，該統(tǒng)一數(shù)據(jù)源用于向頁面上的多個(gè)頁面組件提供數(shù)據(jù)，具體地，統(tǒng)一數(shù)據(jù)源與頁面上的各個(gè)頁面組件進(jìn)行雙向綁定，從而統(tǒng)一數(shù)據(jù)源可以向各個(gè)頁面組件傳入數(shù)據(jù)，頁面組件可以檢測統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化，還可以將頁面組件中發(fā)生的事件傳入統(tǒng)一數(shù)據(jù)源。

需要說明的是，統(tǒng)一數(shù)據(jù)源與各個(gè)頁面組件之間建立有綁定關(guān)系，各個(gè)組件之間，不具有業(yè)務(wù)邏輯關(guān)系，也即，每個(gè)頁面組件上的數(shù)據(jù)或顯示的變更，受到統(tǒng)一數(shù)據(jù)源的影響，而其他組件中發(fā)生數(shù)據(jù)變更或發(fā)生邏輯變更，并不影響當(dāng)前頁面組件的數(shù)據(jù)或顯示。

如圖5所示的數(shù)據(jù)驅(qū)動(dòng)的技術(shù)架構(gòu)圖中，該頁面中包括三個(gè)頁面組件，該技術(shù)方案中的統(tǒng)一數(shù)據(jù)源分別與該三個(gè)頁面組件(包括頁面組件A、頁面組件B以及頁面組件C)之間建立有綁定關(guān)系，每個(gè)頁面組件的數(shù)據(jù)變更來源于統(tǒng)一數(shù)據(jù)源，如，統(tǒng)一數(shù)據(jù)源的數(shù)據(jù)發(fā)生變化，頁面組件的數(shù)據(jù)會(huì)響應(yīng)該變化，進(jìn)行顯示變更。

圖5中示出的統(tǒng)一數(shù)據(jù)源可以通過數(shù)據(jù)拉取接口和路由系統(tǒng)獲取發(fā)生變化的數(shù)據(jù)，并利用該發(fā)生變化的數(shù)據(jù)對統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)進(jìn)行更新，得到更新后的數(shù)據(jù)。

該數(shù)據(jù)架構(gòu)中的視圖層(即View層)可以包含多個(gè)頁面組件，如圖5所示，可以包含頁面組件A、頁面組件B和頁面組件C。每個(gè)頁面組件分別與統(tǒng)一數(shù)據(jù)源建立有綁定關(guān)系，該綁定關(guān)系使得頁面組件可以檢測統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生改變，還可以將統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)傳入對應(yīng)的頁面組件。

在一個(gè)可選的實(shí)施例中，頁面組件檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，進(jìn)一步地檢測該發(fā)生變化的數(shù)據(jù)中是否存在與該頁面組件相對應(yīng)的數(shù)據(jù)，若存在，則確定檢測到數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化。

在步驟S404提供的技術(shù)方案中，若檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入到對應(yīng)的頁面組件中，在這個(gè)過程中，不會(huì)有其他頁面組件中的數(shù)據(jù)傳入該頁面組件。

可選地，將更新后的數(shù)據(jù)傳入頁面組件中時(shí)，數(shù)據(jù)沒有發(fā)生改變的頁面組件中無需傳入更新后的數(shù)據(jù)，哪些頁面組件的數(shù)據(jù)發(fā)生了改變，則向哪些頁面組件中傳輸數(shù)據(jù)，減少了數(shù)據(jù)傳輸?shù)娜哂?，提高了?shù)據(jù)傳輸效率。

在步驟S406提供的技術(shù)方案中，響應(yīng)于傳入的更新后的數(shù)據(jù)，在多個(gè)頁面組件中對頁面內(nèi)容進(jìn)行更新顯示。

上述的統(tǒng)一數(shù)據(jù)源中的每一種數(shù)據(jù)狀態(tài)對應(yīng)一個(gè)顯示快照，在統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化時(shí)，會(huì)將數(shù)據(jù)傳入頁面組件，以改變頁面組件的顯示更新。

在上述實(shí)施例中，由統(tǒng)一數(shù)據(jù)源對數(shù)據(jù)更新進(jìn)行統(tǒng)一管理，將頁面組件封裝成純樣式的組件，解除了各種組件之間的邏輯耦合和文件對象模型(Document Object Model，簡稱DOM)耦合，使得每一種數(shù)據(jù)狀態(tài)決定一種視圖快照，如圖2中示出的復(fù)雜的蜘蛛網(wǎng)式的關(guān)系鏈變成統(tǒng)一數(shù)據(jù)源對各個(gè)頁面組件的關(guān)系，頁面上的所有操作全部變成了對數(shù)據(jù)的操作，可以在提高數(shù)據(jù)更新效率的情況下，使得前端代碼變得友好，高度可維護(hù)，對開發(fā)人員來說也上手簡單，邏輯清晰。

在一個(gè)可選的實(shí)施例中，將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中可以包括：通過預(yù)定方式將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中，其中，預(yù)定方式用于傳輸狀態(tài)函數(shù)，狀態(tài)函數(shù)與更新后的數(shù)據(jù)相對應(yīng)。

其中，上述的預(yù)定方式可以為props的方式，該方式可以對待傳輸?shù)臄?shù)據(jù)進(jìn)行解構(gòu)賦值，并將解構(gòu)得到的全部或部分屬性值進(jìn)行傳輸，具體地，父組件(如本申請的統(tǒng)一數(shù)據(jù)源)將更新后的數(shù)據(jù)發(fā)給頁面組件時(shí)，可以對更新后的數(shù)據(jù)進(jìn)行解構(gòu)賦值，并生成對應(yīng)的狀態(tài)函數(shù)，子組件(如上述的頁面組件)接收到狀態(tài)函數(shù)之后，根據(jù)該狀態(tài)函數(shù)中的變量和函數(shù)邏輯，確定子組件需執(zhí)行的動(dòng)作。

在本申請實(shí)施例中，頁面組件向頁面組件中的模塊傳輸數(shù)據(jù)也可以使用該方式。

具體地，頁面組件中數(shù)據(jù)的顯示依賴于統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)變量或數(shù)據(jù)狀態(tài)，或者，在頁面組件中利用統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)進(jìn)行更新顯示時(shí)，可以將與該頁面組件對應(yīng)的更新后的數(shù)據(jù)進(jìn)行解析，得到一個(gè)或多個(gè)函數(shù)關(guān)系，每個(gè)函數(shù)關(guān)系中均可以記錄有業(yè)務(wù)邏輯，確定每個(gè)函數(shù)關(guān)系中的部分或全部變量，將該部分或全部變量傳入對應(yīng)的頁面組件。

可選地，預(yù)先設(shè)置數(shù)據(jù)與狀態(tài)函數(shù)的對應(yīng)關(guān)系，在確定數(shù)據(jù)A的狀態(tài)發(fā)生變化之后，讀取與該數(shù)據(jù)狀態(tài)或數(shù)據(jù)對應(yīng)的函數(shù)關(guān)系(即上述的狀態(tài)函數(shù))，將該函數(shù)關(guān)系中的部分或全部變量傳入對應(yīng)的頁面組件，頁面組件接收到該變量之后，響應(yīng)該變量進(jìn)行數(shù)據(jù)的更新顯示。

其中，通過props的方式將更新后的數(shù)據(jù)傳入對應(yīng)的頁面組件時(shí)，可以將待傳輸?shù)淖兞繉?yīng)的函數(shù)關(guān)系傳入頁面組件，或者將傳輸變量對應(yīng)的函數(shù)關(guān)系的標(biāo)識(shí)傳入頁面組件。

在另一個(gè)可選的實(shí)施例中，可以將業(yè)務(wù)邏輯預(yù)先設(shè)置在頁面組件中，頁面組件接收到更新后的數(shù)據(jù)，利用其預(yù)先設(shè)置的業(yè)務(wù)邏輯確定更新后的數(shù)據(jù)對應(yīng)的動(dòng)作，并執(zhí)行該動(dòng)作。

在本發(fā)明上述實(shí)施例中，在多個(gè)頁面組件中對頁面內(nèi)容進(jìn)行更新顯示可以包括：根據(jù)更新后的數(shù)據(jù)對頁面組件的顯示樣式進(jìn)行更新，其中，顯示樣式用于顯示頁面內(nèi)容。

具體地，可以在檢測到數(shù)據(jù)發(fā)生變化時(shí)，將統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)發(fā)送至對應(yīng)的頁面組件，根據(jù)更新后的數(shù)據(jù)對頁面組件的顯示樣式進(jìn)行更新，該更新可以包括顯示或隱藏的更新、顯示位置的更新、以及顯示模板的更新等等。

根據(jù)更新后的數(shù)據(jù)對頁面組件的顯示樣式進(jìn)行更新可以包括：根據(jù)預(yù)先設(shè)置的業(yè)務(wù)邏輯和更新后的數(shù)據(jù)確定頁面組件中一個(gè)或多個(gè)顯示模塊的動(dòng)作，并指示一個(gè)或多個(gè)顯示模塊執(zhí)行對應(yīng)的動(dòng)作，以更新頁面組件的顯示樣式。

通過上述實(shí)施例，頁面組件中的顯示模塊中不包含業(yè)務(wù)邏輯，也即頁面組件中的顯示模塊封裝成了純樣式的顯示模塊，通過頁面組件統(tǒng)一接收統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)，并由頁面組件統(tǒng)一確定其中的顯示模塊的動(dòng)作，顯示模塊執(zhí)行對應(yīng)的動(dòng)作，以更新頁面的顯示樣式，在整個(gè)過程中，規(guī)范了數(shù)據(jù)源的管理，將邏輯聚焦在頁面組件中，使得每一種數(shù)據(jù)狀態(tài)可以對應(yīng)一種視圖快照，邏輯清晰，處理速度快。

在一個(gè)可選的實(shí)施例中，根據(jù)更新后的數(shù)據(jù)對頁面組件的顯示樣式進(jìn)行更新包括：根據(jù)更新后的數(shù)據(jù)將顯示樣式從第一樣式調(diào)整到第二樣式，或者，從第二樣式調(diào)整到第一樣式，其中，第一樣式用于指示顯示頁面內(nèi)容，第二樣式用于指示不顯示頁面內(nèi)容。

具體地，檢測統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入對應(yīng)的頁面組件，若頁面組件在傳入更新后的數(shù)據(jù)之前處于不顯示頁面內(nèi)容的第二樣式，根據(jù)該更新后的數(shù)據(jù)確定的顯示樣式為第一樣式，則該頁面組件顯示在該頁面上；或者，若頁面組件在傳入更新后的數(shù)據(jù)之前處于顯示頁面內(nèi)容的第一樣式，根據(jù)該更新后的數(shù)據(jù)確定的顯示樣式為第二樣式，則該頁面組件不再顯示在該頁面上。

可選地，上述的顯示可以為部分顯示，上述的不顯示可以為部分不顯示，例如，可以是顯示模塊1顯示對應(yīng)的頁面內(nèi)容，顯示模塊2不顯示對應(yīng)的頁面內(nèi)容。

在通過props傳入數(shù)據(jù)的情況下，根據(jù)統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)確定頁面組件A的顯示樣式為第一樣式或第二樣式，則將顯示函數(shù)display的變量傳入對應(yīng)的頁面組件，如，傳輸?shù)淖兞繛閐isplay(a1＝1，a2＝0)，其中，1可以表示第一樣式，0可以表示第二樣式，該第一樣式和第二樣式對應(yīng)的變量值可以預(yù)先設(shè)置。

頁面組件接收到變量display(1)之后，調(diào)取顯示函數(shù)，確定接收到的變量指示顯示模塊a1顯示內(nèi)容，顯示模塊a2不顯示內(nèi)容，則頁面組件指示顯示模塊a1顯示對應(yīng)的頁面內(nèi)容，顯示模塊a2不顯示對應(yīng)的頁面內(nèi)容。

在另一種可選的實(shí)施例中，根據(jù)更新后的數(shù)據(jù)將顯示樣式中頁面內(nèi)容的顯示位置從第一位置調(diào)整到第二位置。

具體地，該頁面內(nèi)容的顯示位置可以基于位置坐標(biāo)確定，進(jìn)一步地可選地，該頁面內(nèi)容的顯示位置可以基于頁面組件中基準(zhǔn)點(diǎn)的位置坐標(biāo)而確定。

在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化的情況下，若該發(fā)生變化的數(shù)據(jù)為頁面組件的頁面內(nèi)容的顯示位置的數(shù)據(jù)，則可以將該顯示位置的位置坐標(biāo)傳入對應(yīng)的頁面組件，頁面組件接收到該位置坐標(biāo)之后，將該頁面組件中的頁面內(nèi)容的顯示位置從第一位置調(diào)整至位置坐標(biāo)對應(yīng)的第二位置。

可選地，該頁面內(nèi)容的顯示位置可以基于位置偏移參數(shù)確定。

在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化的情況下，若該發(fā)生變化的數(shù)據(jù)為頁面組件的頁面內(nèi)容的顯示位置的數(shù)據(jù)，則可以將該顯示位置的位置偏移參數(shù)傳入對應(yīng)的頁面組件，頁面組件接收到該位置偏移參數(shù)之后，按照位置偏移參數(shù)，將頁面組件中的頁面內(nèi)容的顯示位置從第一位置調(diào)整至第二位置，如，將該頁面組件中所有內(nèi)容的顯示位置點(diǎn)的坐標(biāo)按照位置偏移參數(shù)調(diào)整，以將顯示位置從第一位置移至第二位置。

在通過props的方式傳輸數(shù)據(jù)的情況下，可以將上述的位置坐標(biāo)或位置偏移操作傳入對應(yīng)的頁面組件，頁面組件基于業(yè)務(wù)邏輯和位置信息(位置坐標(biāo)或位置偏移操作)確定該信息對應(yīng)的顯示模塊和該顯示模塊需執(zhí)行的動(dòng)作，指示該顯示模塊執(zhí)行對應(yīng)的動(dòng)作。

在又一個(gè)可選的實(shí)施例中，根據(jù)更新后的數(shù)據(jù)將顯示樣式中的頁面內(nèi)容從第一信息調(diào)整到第二信息。

具體地，可以將頁面內(nèi)容中的部分或全部頁面內(nèi)容進(jìn)行更新，如，增加頁面內(nèi)容、減少頁面內(nèi)容、將頁面內(nèi)容進(jìn)行變更。

在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化的情況下，若該發(fā)生變化的數(shù)據(jù)為頁面組件的頁面內(nèi)容的信息，則可以將該發(fā)生變化的頁面內(nèi)容的信息傳入對應(yīng)的頁面組件，頁面組件接收到該發(fā)生變化的頁面內(nèi)容的信息之后，按照傳入的變更方式顯示發(fā)生變化的頁面內(nèi)容的信息。

在通過props的方式傳輸數(shù)據(jù)的情況下，可以將上述的發(fā)生變化的數(shù)據(jù)傳入對應(yīng)的頁面組件，并傳入該發(fā)生變化的數(shù)據(jù)的更新方式，如增加、減少或修改。

可選地，還可以將基于發(fā)生變化的數(shù)據(jù)得到的更新后的數(shù)據(jù)全量傳入對應(yīng)的頁面組件，頁面組件接收到該全量的更新后的數(shù)據(jù)之后，直接將當(dāng)前顯示的第一信息調(diào)整為接收到的全量的更新后的數(shù)據(jù)(即上述的第二信息)。

需要說明的是，頁面組件接收到的更新后的數(shù)據(jù)可以指示不同的顯示模塊進(jìn)行不同的更新，具體的實(shí)現(xiàn)方式與上述實(shí)施例中對應(yīng)的技術(shù)方案的實(shí)現(xiàn)方式一致，在此不再贅述。

為了及時(shí)更新數(shù)據(jù)，檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化可以包括：每個(gè)頁面組件周期性地檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化。

可選地，可以每隔一段時(shí)間檢測一次頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化。進(jìn)一步可選地，不同的時(shí)間段可以設(shè)置不同的間隔時(shí)長，例如，晚上12點(diǎn)到早上6點(diǎn)的時(shí)間段，可以將間隔時(shí)長設(shè)置為30分鐘，在早上8點(diǎn)到中午12點(diǎn)的時(shí)間段，可以將間隔時(shí)長設(shè)置為10分鐘，這樣可以在保證及時(shí)更新數(shù)據(jù)的情況下，減小處理器的數(shù)據(jù)處理量，提高數(shù)據(jù)的處理效率。

需要說明的是，在檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化之前，可以包括：為頁面配置統(tǒng)一數(shù)據(jù)源，其中，統(tǒng)一數(shù)據(jù)源包括具有樹狀關(guān)聯(lián)關(guān)系的數(shù)據(jù)源，每一個(gè)或多個(gè)數(shù)據(jù)源用于為一個(gè)頁面組件提供數(shù)據(jù)。

其中，可以預(yù)先設(shè)置具有樹狀關(guān)聯(lián)關(guān)系的數(shù)據(jù)源，在圖6所示的示例中，每個(gè)數(shù)據(jù)源為一個(gè)頁面組件提供數(shù)據(jù)，圖6中的根節(jié)點(diǎn)為統(tǒng)一數(shù)據(jù)源，該根節(jié)點(diǎn)包括三個(gè)父節(jié)點(diǎn)：節(jié)點(diǎn)A、節(jié)點(diǎn)B以及節(jié)點(diǎn)C，節(jié)點(diǎn)A包括子節(jié)點(diǎn)A1和A2，節(jié)點(diǎn)B包括子節(jié)點(diǎn)B1和B2，節(jié)點(diǎn)C包括子節(jié)點(diǎn)C1，子節(jié)點(diǎn)C1包括葉子節(jié)點(diǎn)C101。

該樹狀關(guān)聯(lián)關(guān)系中的每個(gè)節(jié)點(diǎn)表示一個(gè)數(shù)據(jù)源，每個(gè)數(shù)據(jù)源為一個(gè)頁面組件提供數(shù)據(jù)，例如，節(jié)點(diǎn)A為頁面組件A提供數(shù)據(jù)。

根據(jù)本發(fā)明的上述實(shí)施例，在檢測統(tǒng)一數(shù)據(jù)源中的一個(gè)數(shù)據(jù)源發(fā)生數(shù)據(jù)變化時(shí)，將該數(shù)據(jù)發(fā)生變化的數(shù)據(jù)源中的更新后的數(shù)據(jù)傳入對應(yīng)的頁面組件。該頁面組件中包含的子組件共用同一份數(shù)據(jù)。

例如，檢測到節(jié)點(diǎn)A對應(yīng)的數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將該數(shù)據(jù)源中的數(shù)據(jù)傳輸至頁面組件A，頁面組件A基于傳入的信息，通知其包含的顯示模塊進(jìn)行更新顯示。

通過上述實(shí)施例，通過樹狀關(guān)聯(lián)關(guān)系可以快速查找到數(shù)據(jù)發(fā)生變化的數(shù)據(jù)源，并可以快速響應(yīng)該變化，將對應(yīng)頁面組件中的頁面內(nèi)容進(jìn)行更新顯示。

下面結(jié)合圖7至圖9對本申請的上述實(shí)施例進(jìn)行詳細(xì)描述。

如圖7所示的頁面中，從顯示維度來看，該頁面可以包含頁面組件：故障排查的頁面組件A、篩選的頁面組件B和結(jié)果顯示的頁面組件C，其中，頁面組件A包含顯示模塊A1和顯示模塊A2，頁面組件B包含顯示模塊B1和顯示模塊B2，頁面組件C包含顯示模塊C1，顯示模塊C1包含子模塊C101。

其中，顯示模塊A1用于顯示返回首頁的信息，如“首頁”，顯示模塊A2用于顯示故障排查的頁面標(biāo)題，顯示模塊B1用于顯示篩選主題詞的信息，顯示模塊B2用于顯示搜索按鍵，顯示模塊C1用于顯示結(jié)果參數(shù)(如，CPU使用率)，顯示模塊C1用于顯示結(jié)果的具體信息，如圖7中示出的CPU使用率的折線圖。

為頁面配置統(tǒng)一數(shù)據(jù)源，該統(tǒng)一數(shù)據(jù)源包括如圖6所示的具有樹狀關(guān)聯(lián)關(guān)系的數(shù)據(jù)源，每一個(gè)或多個(gè)數(shù)據(jù)源用于為一個(gè)頁面組件提供數(shù)據(jù)。

根據(jù)該配置的統(tǒng)一數(shù)據(jù)源建立的數(shù)據(jù)驅(qū)動(dòng)的架構(gòu)，統(tǒng)一數(shù)據(jù)源Model是當(dāng)前頁面的單一數(shù)據(jù)源SDS，路由驅(qū)動(dòng)route和數(shù)據(jù)拉取接口檢測到數(shù)據(jù)更新的事件，更新的都是統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)，如圖8所示，統(tǒng)一數(shù)據(jù)源通過props的方式將更新后的數(shù)據(jù)傳入頁面組件A、頁面組件B和頁面組件C，頁面組件A、頁面組件B和頁面組件C分別基于更新后的數(shù)據(jù)確定待更新顯示的模塊和待執(zhí)行的更新動(dòng)作，并通知待更新顯示的模塊執(zhí)行對應(yīng)的動(dòng)作。

如圖8所示，在此架構(gòu)中，以props的方式將模型對象Model中的數(shù)據(jù)統(tǒng)一傳入頁面組件，數(shù)據(jù)的變更會(huì)帶來View視圖層響應(yīng)式的變更，這在Vue框架中通過獲取getter/設(shè)置setter實(shí)現(xiàn)。如圖8所示，統(tǒng)一數(shù)據(jù)源可以與各個(gè)頁面組件雙向綁定，來實(shí)現(xiàn)視圖層帶動(dòng)統(tǒng)一數(shù)據(jù)源的變更，這樣可以實(shí)現(xiàn)在大盤監(jiān)控中的交互。

通過上述實(shí)施例，頁面組件通過同一數(shù)據(jù)源Model來實(shí)現(xiàn)通訊，無需直接關(guān)注其他模塊的變化，只關(guān)注統(tǒng)一數(shù)據(jù)源Model中對應(yīng)的數(shù)據(jù)即可。進(jìn)一步地，上述實(shí)施例中，對于各個(gè)模塊組件，只是樣式組件，不帶上邏輯的封裝，通過自定義標(biāo)簽使用，數(shù)據(jù)通過props傳入，用于交互層UI(交互界面)展示用，需要修改數(shù)據(jù)的地方，統(tǒng)一在頁面級的父組件中傳入方法或者通過雙向綁定來操作數(shù)據(jù)。

如圖9所示，每個(gè)頁面組件中包括：頭部、主體和尾部，其中，頭部、主體和尾部分別代表一個(gè)顯示模塊，同一組件中的各個(gè)顯示組件之間沒有連接關(guān)系，通過props的方式將數(shù)據(jù)傳入頁面組件，該頁面組件分別將對應(yīng)的數(shù)據(jù)傳入頭部、主體和尾部的顯示模塊。在開一個(gè)可選的實(shí)施例中，頁面組件可以將接收到的數(shù)據(jù)傳入頭部、主體和尾部，從而頭部、主體和尾部得到同樣的數(shù)據(jù)。數(shù)據(jù)源統(tǒng)一了，組件數(shù)據(jù)統(tǒng)一了，對于移動(dòng)端多種多樣的可視化圖表顯示則賴于echart canvas(產(chǎn)品圖表庫)的支持，根據(jù)數(shù)據(jù)驅(qū)動(dòng)，傳入同一份數(shù)據(jù)，不同的圖表類型則能夠根據(jù)產(chǎn)品需求去變換不同的展示方式，則可從多個(gè)維度去分析監(jiān)控告警，從而可以在CDN(Content Delivery Nerwork，內(nèi)容分發(fā)網(wǎng)絡(luò))側(cè)和用戶側(cè)大盤監(jiān)控的數(shù)據(jù)可視化展示。對于移動(dòng)端輕量、友好，UI(用戶界面)交互簡介，與圖表展示終端(或客戶端)無縫結(jié)合，圖表的可操作性強(qiáng)，方便在告警時(shí)在移動(dòng)端上數(shù)據(jù)的查看和問題排查。

通過上述實(shí)施例，各個(gè)組件直接監(jiān)聽統(tǒng)一數(shù)據(jù)源的變化，各個(gè)組件的屬性只來自于統(tǒng)一數(shù)據(jù)源，通過props的方式傳入將發(fā)生變化的數(shù)據(jù)傳入頁面組件，自上而下的數(shù)據(jù)傳輸方式使得組件數(shù)據(jù)流動(dòng)和來源顯得清晰，并且，各個(gè)組件內(nèi)部組件統(tǒng)一只能用傳入的props，數(shù)據(jù)不存在跨層使用，這樣的組件變得可復(fù)用；進(jìn)一步地，因?yàn)榻M件是通過Vue框架封裝的WeUI純樣式組件，通過數(shù)據(jù)的變化，來改變組件的樣式，從而改變View視圖展示。

通過本申請的上述實(shí)施例，本技術(shù)方案首要解決了移動(dòng)端數(shù)據(jù)可視化開發(fā)中多數(shù)據(jù)源入口，數(shù)據(jù)變更與頁面交互同步的問題。依靠封裝工具echart對移動(dòng)端的強(qiáng)力支持，vue框架的數(shù)據(jù)驅(qū)動(dòng)模式，WeUI的友好交互界面，以及模塊加載器及打包工具webpack、編譯器babel、JavaScript語言的新標(biāo)準(zhǔn)es6帶來的開發(fā)效率的提升，把以往專注于頁面的邏輯，遷移到數(shù)據(jù)層面，讓頁面維護(hù)和邏輯頁面簡單清晰。使得CDN大盤監(jiān)控移動(dòng)端的數(shù)據(jù)可視化開發(fā)變得輕松快捷。

需要說明的是，對于前述的各方法實(shí)施例，為了簡單描述，故將其都表述為一系列的動(dòng)作組合，但是本領(lǐng)域技術(shù)人員應(yīng)該知悉，本發(fā)明并不受所描述的動(dòng)作順序的限制，因?yàn)橐罁?jù)本發(fā)明，某些步驟可以采用其他順序或者同時(shí)進(jìn)行。其次，本領(lǐng)域技術(shù)人員也應(yīng)該知悉，說明書中所描述的實(shí)施例均屬于優(yōu)選實(shí)施例，所涉及的動(dòng)作和模塊并不一定是本發(fā)明所必須的。

通過以上的實(shí)施方式的描述，本領(lǐng)域的技術(shù)人員可以清楚地了解到根據(jù)上述實(shí)施例的方法可借助軟件加必需的通用硬件平臺(tái)的方式來實(shí)現(xiàn)，當(dāng)然也可以通過硬件，但很多情況下前者是更佳的實(shí)施方式。基于這樣的理解，本發(fā)明的技術(shù)方案本質(zhì)上或者說對現(xiàn)有技術(shù)做出貢獻(xiàn)的部分可以以軟件產(chǎn)品的形式體現(xiàn)出來，該計(jì)算機(jī)軟件產(chǎn)品存儲(chǔ)在一個(gè)存儲(chǔ)介質(zhì)(如ROM/RAM、磁碟、光盤)中，包括若干指令用以使得一臺(tái)終端設(shè)備(可以是手機(jī)，計(jì)算機(jī)，服務(wù)器，或者網(wǎng)絡(luò)設(shè)備等)執(zhí)行本發(fā)明各個(gè)實(shí)施例所述的方法。

實(shí)施例2

根據(jù)本發(fā)明實(shí)施例，還提供了一種用于實(shí)施上述數(shù)據(jù)更新方法的數(shù)據(jù)更新裝置。圖10是根據(jù)本發(fā)明實(shí)施例的一種可選的數(shù)據(jù)更新裝置的示意圖，如圖10所示，該裝置可以包括：

檢測單元1001，用于檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化，其中，統(tǒng)一數(shù)據(jù)源用于向頁面上的多個(gè)頁面組件提供數(shù)據(jù)，頁面組件用于根據(jù)提供的數(shù)據(jù)進(jìn)行頁面內(nèi)容的顯示；

傳輸單元1003，用于若檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中；

顯示單元1005，用于響應(yīng)于傳入的更新后的數(shù)據(jù)，在多個(gè)頁面組件中對頁面內(nèi)容進(jìn)行更新顯示。

通過上述步驟S402至步驟S408，在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化之后，將更新后的數(shù)據(jù)傳入頁面組件中，并響應(yīng)該傳入的更新后的數(shù)據(jù)在頁面組件中更新顯示，以完成對數(shù)據(jù)的更新。在該方案中，利用統(tǒng)一數(shù)據(jù)源對頁面組件中的數(shù)據(jù)進(jìn)行管理，并且頁面組件響應(yīng)于該統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)進(jìn)行顯示，解除了頁面組件之間的邏輯耦合，在上述的數(shù)據(jù)更新過程中，各個(gè)頁面組件之間不需要進(jìn)行數(shù)據(jù)交互，將統(tǒng)一數(shù)據(jù)源的數(shù)據(jù)傳入頁面組件中，頁面組件響應(yīng)該傳入的數(shù)據(jù)直接進(jìn)行更新顯示，提高了數(shù)據(jù)更新的效率，解決了現(xiàn)有技術(shù)中更新效率低的技術(shù)問題。

進(jìn)一步地，傳輸單元包括：傳輸模塊，用于通過預(yù)定方式將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中，其中，預(yù)定方式用于傳輸狀態(tài)函數(shù)，狀態(tài)函數(shù)與更新后的數(shù)據(jù)相對應(yīng)。

上述實(shí)施例中，顯示單元可以包括：更新模塊，用于根據(jù)更新后的數(shù)據(jù)對頁面組件的顯示樣式進(jìn)行更新，其中，顯示樣式用于顯示頁面內(nèi)容。

根據(jù)本發(fā)明的上述實(shí)施例，更新模塊具體用于：

根據(jù)更新后的數(shù)據(jù)確定頁面組件中一個(gè)或多個(gè)顯示模塊的動(dòng)作，并指示一個(gè)或多個(gè)顯示模塊執(zhí)行對應(yīng)的動(dòng)作，其中，一個(gè)或多個(gè)顯示模塊的動(dòng)作用于更新顯示頁面組件的顯示樣式。

進(jìn)一步地，更新模塊包括以下至少之一：

第一子模塊，用于根據(jù)更新后的數(shù)據(jù)將顯示樣式從第一樣式調(diào)整到第二樣式，或者，從第二樣式調(diào)整到第一樣式，其中，第一樣式用于指示顯示頁面內(nèi)容，第二樣式用于指示不顯示頁面內(nèi)容；第二子模塊，用于根據(jù)更新后的數(shù)據(jù)將顯示樣式中頁面內(nèi)容的顯示位置從第一位置調(diào)整到第二位置；第三子模塊，用于根據(jù)更新后的數(shù)據(jù)將顯示樣式中的頁面內(nèi)容從第一信息調(diào)整到第二信息。

通過上述實(shí)施例，頁面組件中的顯示模塊中不包含業(yè)務(wù)邏輯，也即頁面組件中的顯示模塊封裝成了純樣式的顯示模塊，通過頁面組件統(tǒng)一接收統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)，并由頁面組件統(tǒng)一確定其中的顯示模塊的動(dòng)作，顯示模塊執(zhí)行對應(yīng)的動(dòng)作，以更新頁面的顯示樣式，在整個(gè)過程中，規(guī)范了數(shù)據(jù)源的管理，將邏輯聚焦在頁面組件中，使得每一種數(shù)據(jù)狀態(tài)可以對應(yīng)一種視圖快照，邏輯清晰，處理速度快。

需要說明的是，檢測單元具體用于：每個(gè)頁面組件周期性地檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化。

可選地，可以每隔一段時(shí)間檢測一次頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化。進(jìn)一步可選地，不同的時(shí)間段可以設(shè)置不同的間隔時(shí)長，這樣可以在保證及時(shí)更新數(shù)據(jù)的情況下，減小處理器的數(shù)據(jù)處理量，提高數(shù)據(jù)的處理效率。

進(jìn)一步地，裝置還包括：配置單元，用于在檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化之前，為頁面配置統(tǒng)一數(shù)據(jù)源，其中，統(tǒng)一數(shù)據(jù)源包括具有樹狀關(guān)聯(lián)關(guān)系的數(shù)據(jù)源，每一個(gè)或多個(gè)數(shù)據(jù)源用于為一個(gè)頁面組件提供數(shù)據(jù)。

進(jìn)一步地，本方案基于vue框架實(shí)現(xiàn)的組件化，因此網(wǎng)頁模板層是文件對象模塊引擎的，這在一定程度上局限了以往渲染時(shí)字符串模板引擎String-based templating的技術(shù)方案的遷移，而且在模板層面，是沒有虛擬文件對象Virtual-dom的概念的，因此，如果加上Virtual-dom的話，在理論上性能是提升幾倍的，模板層也可以去換成字符串模板引擎，則不同的模板引擎可以根據(jù)開發(fā)者自己需要去替換。

此處需要說明的是，上述模塊與對應(yīng)的步驟所實(shí)現(xiàn)的示例和應(yīng)用場景相同，但不限于上述實(shí)施例所公開的內(nèi)容。需要說明的是，上述模塊作為裝置的一部分可以運(yùn)行在如圖3所示的硬件環(huán)境中，可以通過軟件實(shí)現(xiàn)，也可以通過硬件實(shí)現(xiàn)，其中，硬件環(huán)境包括網(wǎng)絡(luò)環(huán)境。

實(shí)施例3

根據(jù)本發(fā)明實(shí)施例，還提供了一種用于實(shí)施上述數(shù)據(jù)更新方法的服務(wù)器或終端。

圖11是根據(jù)本發(fā)明實(shí)施例的一種終端的結(jié)構(gòu)框圖，如圖11所示，該終端可以包括：一個(gè)或多個(gè)(圖中僅示出一個(gè))處理器201、存儲(chǔ)器203、以及傳輸裝置205(如上述實(shí)施例中的發(fā)送裝置)，如圖11所示，該終端還可以包括輸入輸出設(shè)備207。

其中，存儲(chǔ)器203可用于存儲(chǔ)軟件程序以及模塊，如本發(fā)明實(shí)施例中的數(shù)據(jù)更新方法和裝置對應(yīng)的程序指令/模塊，處理器201通過運(yùn)行存儲(chǔ)在存儲(chǔ)器203內(nèi)的軟件程序以及模塊，從而執(zhí)行各種功能應(yīng)用以及數(shù)據(jù)處理，即實(shí)現(xiàn)上述的數(shù)據(jù)更新方法。存儲(chǔ)器203可包括高速隨機(jī)存儲(chǔ)器，還可以包括非易失性存儲(chǔ)器，如一個(gè)或者多個(gè)磁性存儲(chǔ)裝置、閃存、或者其他非易失性固態(tài)存儲(chǔ)器。在一些實(shí)例中，存儲(chǔ)器203可進(jìn)一步包括相對于處理器201遠(yuǎn)程設(shè)置的存儲(chǔ)器，這些遠(yuǎn)程存儲(chǔ)器可以通過網(wǎng)絡(luò)連接至終端。上述網(wǎng)絡(luò)的實(shí)例包括但不限于互聯(lián)網(wǎng)、企業(yè)內(nèi)部網(wǎng)、局域網(wǎng)、移動(dòng)通信網(wǎng)及其組合。

上述的傳輸裝置205用于經(jīng)由一個(gè)網(wǎng)絡(luò)接收或者發(fā)送數(shù)據(jù)，還可以用于處理器與存儲(chǔ)器之間的數(shù)據(jù)傳輸。上述的網(wǎng)絡(luò)具體實(shí)例可包括有線網(wǎng)絡(luò)及無線網(wǎng)絡(luò)。在一個(gè)實(shí)例中，傳輸裝置205包括一個(gè)網(wǎng)絡(luò)適配器(Network Interface Controller，NIC)，其可通過網(wǎng)線與其他網(wǎng)絡(luò)設(shè)備與路由器相連從而可與互聯(lián)網(wǎng)或局域網(wǎng)進(jìn)行通訊。在一個(gè)實(shí)例中，傳輸裝置205為射頻(Radio Frequency，RF)模塊，其用于通過無線方式與互聯(lián)網(wǎng)進(jìn)行通訊。

其中，具體地，存儲(chǔ)器203用于存儲(chǔ)應(yīng)用程序。

處理器201可以通過傳輸裝置205調(diào)用存儲(chǔ)器203存儲(chǔ)的應(yīng)用程序，以執(zhí)行下述步驟：檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化，其中，統(tǒng)一數(shù)據(jù)源用于向頁面上的多個(gè)頁面組件提供數(shù)據(jù)，頁面組件用于根據(jù)提供的數(shù)據(jù)進(jìn)行頁面內(nèi)容的顯示；若檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中；響應(yīng)于傳入的更新后的數(shù)據(jù)，在多個(gè)頁面組件中對頁面內(nèi)容進(jìn)行更新顯示。

處理器201還用于執(zhí)行下述步驟：通過預(yù)定方式將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中，其中，預(yù)定方式用于傳輸狀態(tài)函數(shù)，狀態(tài)函數(shù)與更新后的數(shù)據(jù)相對應(yīng)。

處理器201還用于執(zhí)行下述步驟：根據(jù)更新后的數(shù)據(jù)對頁面組件的顯示樣式進(jìn)行更新，其中，顯示樣式用于顯示頁面內(nèi)容。

處理器201還用于執(zhí)行下述步驟：根據(jù)更新后的數(shù)據(jù)確定頁面組件中一個(gè)或多個(gè)顯示模塊的動(dòng)作，并指示一個(gè)或多個(gè)顯示模塊執(zhí)行對應(yīng)的動(dòng)作，其中，一個(gè)或多個(gè)顯示模塊的動(dòng)作用于更新顯示頁面組件的顯示樣式。

處理器201還用于執(zhí)行下述步驟：根據(jù)更新后的數(shù)據(jù)將顯示樣式從第一樣式調(diào)整到第二樣式，或者，從第二樣式調(diào)整到第一樣式，其中，第一樣式用于指示顯示頁面內(nèi)容，第二樣式用于指示不顯示頁面內(nèi)容；根據(jù)更新后的數(shù)據(jù)將顯示樣式中頁面內(nèi)容的顯示位置從第一位置調(diào)整到第二位置；根據(jù)更新后的數(shù)據(jù)將顯示樣式中的頁面內(nèi)容從第一信息調(diào)整到第二信息。

處理器201還用于執(zhí)行下述步驟：每個(gè)頁面組件周期性地檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化。

處理器201還用于執(zhí)行下述步驟：在檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化之前，為頁面配置統(tǒng)一數(shù)據(jù)源，其中，統(tǒng)一數(shù)據(jù)源包括具有樹狀關(guān)聯(lián)關(guān)系的數(shù)據(jù)源，每一個(gè)或多個(gè)數(shù)據(jù)源用于為一個(gè)頁面組件提供數(shù)據(jù)。

在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化之后，將更新后的數(shù)據(jù)傳入頁面組件中，并響應(yīng)該傳入的更新后的數(shù)據(jù)在頁面組件中更新顯示，以完成對數(shù)據(jù)的更新。在該方案中，利用統(tǒng)一數(shù)據(jù)源對頁面組件中的數(shù)據(jù)進(jìn)行管理，并且頁面組件響應(yīng)于該統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)進(jìn)行顯示，解除了頁面組件之間的邏輯耦合，在上述的數(shù)據(jù)更新過程中，各個(gè)頁面組件之間不需要進(jìn)行數(shù)據(jù)交互，將統(tǒng)一數(shù)據(jù)源的數(shù)據(jù)傳入頁面組件中，頁面組件響應(yīng)該傳入的數(shù)據(jù)直接進(jìn)行更新顯示，提高了數(shù)據(jù)更新的效率，解決了現(xiàn)有技術(shù)中更新效率低的技術(shù)問題。

可選地，本實(shí)施例中的具體示例可以參考上述實(shí)施例中所描述的示例，本實(shí)施例在此不再贅述。

本領(lǐng)域普通技術(shù)人員可以理解，圖11所示的結(jié)構(gòu)僅為示意，終端可以是智能手機(jī)(如Android手機(jī)、iOS手機(jī)等)、平板電腦、掌上電腦以及移動(dòng)互聯(lián)網(wǎng)設(shè)備(Mobile Internet Devices，MID)、PAD等終端設(shè)備。圖11其并不對上述電子裝置的結(jié)構(gòu)造成限定。例如，終端還可包括比圖11中所示更多或者更少的組件(如網(wǎng)絡(luò)接口、顯示裝置等)，或者具有與圖11所示不同的配置。

本領(lǐng)域普通技術(shù)人員可以理解上述實(shí)施例的各種方法中的全部或部分步驟是可以通過程序來指令終端設(shè)備相關(guān)的硬件來完成，該程序可以存儲(chǔ)于一計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)中，存儲(chǔ)介質(zhì)可以包括：閃存盤、只讀存儲(chǔ)器(Read-Only Memory，ROM)、隨機(jī)存取器(Random Access Memory，RAM)、磁盤或光盤等。

實(shí)施例4

本發(fā)明的實(shí)施例還提供了一種存儲(chǔ)介質(zhì)?？蛇x地，在本實(shí)施例中，上述存儲(chǔ)介質(zhì)可以用于執(zhí)行數(shù)據(jù)更新方法的程序代碼。

可選地，在本實(shí)施例中，上述存儲(chǔ)介質(zhì)可以位于上述實(shí)施例所示的網(wǎng)絡(luò)中的多個(gè)網(wǎng)絡(luò)設(shè)備中的至少一個(gè)網(wǎng)絡(luò)設(shè)備上。

可選地，在本實(shí)施例中，存儲(chǔ)介質(zhì)被設(shè)置為存儲(chǔ)用于執(zhí)行以下步驟的程序代碼：

檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化，其中，統(tǒng)一數(shù)據(jù)源用于向頁面上的多個(gè)頁面組件提供數(shù)據(jù)，頁面組件用于根據(jù)提供的數(shù)據(jù)進(jìn)行頁面內(nèi)容的顯示；若檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化，則將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中；響應(yīng)于傳入的更新后的數(shù)據(jù)，在多個(gè)頁面組件中對頁面內(nèi)容進(jìn)行更新顯示。

可選地，存儲(chǔ)介質(zhì)還被設(shè)置為存儲(chǔ)用于執(zhí)行以下步驟的程序代碼：通過預(yù)定方式將更新后的數(shù)據(jù)傳入到多個(gè)頁面組件中，其中，預(yù)定方式用于傳輸狀態(tài)函數(shù)，狀態(tài)函數(shù)與更新后的數(shù)據(jù)相對應(yīng)。

可選地，存儲(chǔ)介質(zhì)還被設(shè)置為存儲(chǔ)用于執(zhí)行以下步驟的程序代碼：根據(jù)更新后的數(shù)據(jù)對頁面組件的顯示樣式進(jìn)行更新，其中，顯示樣式用于顯示頁面內(nèi)容。

可選地，存儲(chǔ)介質(zhì)還被設(shè)置為存儲(chǔ)用于執(zhí)行以下步驟的程序代碼：根據(jù)更新后的數(shù)據(jù)確定頁面組件中一個(gè)或多個(gè)顯示模塊的動(dòng)作，并指示一個(gè)或多個(gè)顯示模塊執(zhí)行對應(yīng)的動(dòng)作，其中，一個(gè)或多個(gè)顯示模塊的動(dòng)作用于更新顯示頁面組件的顯示樣式。

可選地，存儲(chǔ)介質(zhì)還被設(shè)置為存儲(chǔ)用于執(zhí)行以下步驟的程序代碼：根據(jù)更新后的數(shù)據(jù)將顯示樣式從第一樣式調(diào)整到第二樣式，或者，從第二樣式調(diào)整到第一樣式，其中，第一樣式用于指示顯示頁面內(nèi)容，第二樣式用于指示不顯示頁面內(nèi)容；根據(jù)更新后的數(shù)據(jù)將顯示樣式中頁面內(nèi)容的顯示位置從第一位置調(diào)整到第二位置；根據(jù)更新后的數(shù)據(jù)將顯示樣式中的頁面內(nèi)容從第一信息調(diào)整到第二信息。

可選地，存儲(chǔ)介質(zhì)還被設(shè)置為存儲(chǔ)用于執(zhí)行以下步驟的程序代碼：每個(gè)頁面組件周期性地檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化。

可選地，存儲(chǔ)介質(zhì)還被設(shè)置為存儲(chǔ)用于執(zhí)行以下步驟的程序代碼：在檢測頁面上的統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)是否發(fā)生變化之前，為頁面配置統(tǒng)一數(shù)據(jù)源，其中，統(tǒng)一數(shù)據(jù)源包括具有樹狀關(guān)聯(lián)關(guān)系的數(shù)據(jù)源，每一個(gè)或多個(gè)數(shù)據(jù)源用于為一個(gè)頁面組件提供數(shù)據(jù)。

在檢測到統(tǒng)一數(shù)據(jù)源中的數(shù)據(jù)發(fā)生變化之后，將更新后的數(shù)據(jù)傳入頁面組件中，并響應(yīng)該傳入的更新后的數(shù)據(jù)在頁面組件中更新顯示，以完成對數(shù)據(jù)的更新。在該方案中，利用統(tǒng)一數(shù)據(jù)源對頁面組件中的數(shù)據(jù)進(jìn)行管理，并且頁面組件響應(yīng)于該統(tǒng)一數(shù)據(jù)源中的更新后的數(shù)據(jù)進(jìn)行顯示，解除了頁面組件之間的邏輯耦合，在上述的數(shù)據(jù)更新過程中，各個(gè)頁面組件之間不需要進(jìn)行數(shù)據(jù)交互，將統(tǒng)一數(shù)據(jù)源的數(shù)據(jù)傳入頁面組件中，頁面組件響應(yīng)該傳入的數(shù)據(jù)直接進(jìn)行更新顯示，提高了數(shù)據(jù)更新的效率，解決了現(xiàn)有技術(shù)中更新效率低的技術(shù)問題。

可選地，本實(shí)施例中的具體示例可以參考上述實(shí)施例中所描述的示例，本實(shí)施例在此不再贅述。

可選地，在本實(shí)施例中，上述存儲(chǔ)介質(zhì)可以包括但不限于：U盤、只讀存儲(chǔ)器(ROM，Read-Only Memory)、隨機(jī)存取存儲(chǔ)器(RAM，Random Access Memory)、移動(dòng)硬盤、磁碟或者光盤等各種可以存儲(chǔ)程序代碼的介質(zhì)。

上述本發(fā)明實(shí)施例序號僅僅為了描述，不代表實(shí)施例的優(yōu)劣。

上述實(shí)施例中的集成的單元如果以軟件功能單元的形式實(shí)現(xiàn)并作為獨(dú)立的產(chǎn)品銷售或使用時(shí)，可以存儲(chǔ)在上述計(jì)算機(jī)可讀取的存儲(chǔ)介質(zhì)中。基于這樣的理解，本發(fā)明的技術(shù)方案本質(zhì)上或者說對現(xiàn)有技術(shù)做出貢獻(xiàn)的部分或者該技術(shù)方案的全部或部分可以以軟件產(chǎn)品的形式體現(xiàn)出來，該計(jì)算機(jī)軟件產(chǎn)品存儲(chǔ)在存儲(chǔ)介質(zhì)中，包括若干指令用以使得一臺(tái)或多臺(tái)計(jì)算機(jī)設(shè)備(可為個(gè)人計(jì)算機(jī)、服務(wù)器或者網(wǎng)絡(luò)設(shè)備等)執(zhí)行本發(fā)明各個(gè)實(shí)施例所述方法的全部或部分步驟。

在本發(fā)明的上述實(shí)施例中，對各個(gè)實(shí)施例的描述都各有側(cè)重，某個(gè)實(shí)施例中沒有詳述的部分，可以參見其他實(shí)施例的相關(guān)描述。

在本申請所提供的幾個(gè)實(shí)施例中，應(yīng)該理解到，所揭露的客戶端，可通過其它的方式實(shí)現(xiàn)。其中，以上所描述的裝置實(shí)施例僅僅是示意性的，例如所述單元的劃分，僅僅為一種邏輯功能劃分，實(shí)際實(shí)現(xiàn)時(shí)可以有另外的劃分方式，例如多個(gè)單元或組件可以結(jié)合或者可以集成到另一個(gè)系統(tǒng)，或一些特征可以忽略，或不執(zhí)行。另一點(diǎn)，所顯示或討論的相互之間的耦合或直接耦合或通信連接可以是通過一些接口，單元或模塊的間接耦合或通信連接，可以是電性或其它的形式。

所述作為分離部件說明的單元可以是或者也可以不是物理上分開的，作為單元顯示的部件可以是或者也可以不是物理單元，即可以位于一個(gè)地方，或者也可以分布到多個(gè)網(wǎng)絡(luò)單元上?？梢愿鶕?jù)實(shí)際的需要選擇其中的部分或者全部單元來實(shí)現(xiàn)本實(shí)施例方案的目的。

另外，在本發(fā)明各個(gè)實(shí)施例中的各功能單元可以集成在一個(gè)處理單元中，也可以是各個(gè)單元單獨(dú)物理存在，也可以兩個(gè)或兩個(gè)以上單元集成在一個(gè)單元中。上述集成的單元既可以采用硬件的形式實(shí)現(xiàn)，也可以采用軟件功能單元的形式實(shí)現(xiàn)。

以上所述僅是本發(fā)明的優(yōu)選實(shí)施方式，應(yīng)當(dāng)指出，對于本技術(shù)領(lǐng)域的普通技術(shù)人員來說，在不脫離本發(fā)明原理的前提下，還可以做出若干改進(jìn)和潤飾，這些改進(jìn)和潤飾也應(yīng)視為本發(fā)明的保護(hù)范圍。