axios之Vue請求初始化數據放在Created還是Mounted?


先分析下生命周期

beforecreated:el 和 data 並未初始化 
created:完成了 data 數據的初始化,el沒有
beforeMount:完成了 el 和 data 初始化 
mounted :完成掛載

 

(1)mounted

  很多人跟我說初始化放在Mounted里面, 我問她(他)們為什么?她(他)們回答說因為這個時候DOM初始化渲染好啦。然后我繼續問DOM初始化渲染和請求初始化數據有什么關系?他們會說可以顯示請求出來的數據啦。(大家覺得有沖突嗎?)

DOM初始化渲染和請求初始化數據並沒有什么沖突

  讓我們在看看前面的Vue生命周期

  a、beforeCreate:
    (在實例初始化之后,數據觀測 (data observer) 和 event/watcher 事件配置之前被調用。---官方貼的)

    

 

   b、beforeMount:

    (在掛載開始之前被調用:相關的 render 函數首次被調用。---官方貼的)

    

 

   

看了這個2個我們繼續分析:

我們請求回來的初始化數據或者基礎數據是不是需要掛在Vue的Data上面?(是的,需要√)
然后我們繼續beforeCreate的時候Data有沒有生成?(答案是:沒有。×)
--所以這一步是無法把數據掛到Vue的Data上面的
然后我繼續看created的時候Data有沒有生成?(答案是:生成啦。√)
--所以這一步我們是可以把數據掛到Vue的Data上面的,是不是可以放在這里啦?
--是的,可以放在這里啦。所以最后結論就是放在created里面。

 

補充分析:

(1)mounted

  如果把所有請求放在created里面的話,請求過多會,加載太慢會導致頁面出現短暫的白屏情況,一般上我寫的話,接口不復雜會放created里面,接口多復雜的話會放在mounted里面.

(2)mounted

  created 是加載DOM,html之后 就馬上執行, 比如初始化,獲取屏幕高度調整,賦值等等,而mounted就是執行包括js之后,准備開始調用方法,也就是說 類似傳統開發那樣,先加載jquery 再調用插件

 

 

 

.


免責聲明!

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



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