VUE-009-頁面打開時初始化配置項內容


網頁開發過程中,尤其是在表單開發過程中,不可避免的會有各種各樣的基礎數據需要展示,供用戶使用。例如,大家在辦理信用卡時,經常需要填寫各種表單數據,其中:性別(男、女)、學歷(高中及以下、大專、本科、研究生及以上)、狀態(啟用、停用)等等,均屬此類。日常軟件開發過程中,通常習慣稱之為配置項。在系統中配置后,提供相應的接口,方便在多個表單頁重復使用。

 

網頁或APP中初始化配置項,通常的做法是在頁面初始化的時候,有些需要立即展示給用戶的,則優先加載配置項內容;否則,可在使用的時候再行加載也可。若配置項使用頻率較高,或配置項本身配置內容較多(耗用網絡資源等),則可以考慮使用本地緩存的方式對配置項進行暫存。

 

VUE中初始化配置項,可在 methods 中編寫相應的方法,請求服務端獲取配置項內容,在頁面初始化時調用方法即可。

我通常習慣將所需的配置項,統一存放在 selectConditions 中,以便后期使用或在頁面跳轉時,傳遞配置項。比如,新增或修改表單頁面跳轉時進行配置項的傳輸,減少服務請求。

VUE初始化請求后端服務,獲取配置項操作(后端接口服務請求不再贅述),如下所示:

 

  上述代碼,請求后端服務接口,並進行相應的數據處理,僅獲取需要的配置項內容進行保存。   

  獲取配置項信息后,在頁面對應所需的屬性位置,進行相應的數據綁定,實現相應的功能即可。部分源碼如下所示:

   上述源碼中, @focus=“pullData” 即為在需要使用的時候,獲取相應的配置項、綁定。

優點是,若用戶未操作相應功能,則節省了網絡流量,頁面初始化速度也快;操作時的數據時效性好。

缺點是,若進行頁面跳轉時,需要將配置項傳給跳轉頁面,則必須在跳轉前進行配置項數據的獲取。否則,跳轉頁面將缺失配置項。

 

頁面配置項的初始化,無論使用哪種方式,無所謂對錯,均可實現相應的功能,適當權衡即可。

 


免責聲明!

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



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