目前在做pc端的項目,后端只提供接口,前端來渲染頁面。在頁面塞了一些空容器(容器并沒有任何樣式,沒有高度),每個接口對應(yīng)的模塊,都有相應(yīng)的容器。每個接口響應(yīng)的時間不同,當(dāng)模板拿到異步請求后的數(shù)據(jù)并綁定數(shù)據(jù),轉(zhuǎn)化成HTML片斷,把它們?nèi)巾撁鎸?yīng)容器中時,就會產(chǎn)生頁面抖動現(xiàn)象。原因就在于每個接口響應(yīng)的時間不一致,而頁面模塊顯示有先后順序,后者可能會在前者渲染之前出現(xiàn),這樣就造成了抖動。比如: 頁面模塊應(yīng)當(dāng)是A1、B2從上到下的顯示順序,但是B2模塊的接口響應(yīng)比A1快,于是可以看到B2模塊先出來了,緊接著A1也出來了,這樣就把B2給擠了下去。對此,有什么好的解決方案嗎?promise方案會有阻塞
異步接口渲染模板引起的頁面抖動
慕姐4208626
2018-09-14 20:09:03