実際のプロジェクトにおけるsetTimeoutと$ nextTickの違い

最近のビッグデータの視覚化は、都市を切り替えることによって行う必要があります。地図は都市に応じて更新されます。百度地図の中心の中心点の緯度と経度を更新することは妥当ですが、中心は都市を切り替えた後に直接割り当てられます。地図のレンダリングが遅いためか、地図は更新されません質問、レンダリング後に値を割り当てることは可能だと思うので、$ nextTickを使用して中央に値を割り当てることを考えました

this。$ nextTick(()=> {

 this.center = this。$ store.state.city.location;

});

この方法の結果、すぐには更新されないのですが、スペースでタップするなど、ページを再保存したとき、つまり、domが再度更新されたときに更新されるので、ちょっと変に感じたのでオンラインで確認しました。

nextTick:次のDOM更新サイクルの後で実行されるようにコールバックを遅らせます。実際には例として成都ビッグデータ可視化センターを取り上げます。デフォルトは成都です。たとえば、長沙市に切り替えても、地図はまだ成都です。市を再度石家荘に切り替えます。マップは現在長沙市は常に一歩減速します、これは彼がコールバックを実行する時間の問題です

最後に、それをsetTimeoutに置き換えました。マップの中央に新しい値を割り当てると、マップがすぐに更新されます。

this.timeout = setTimeout(()=> {

     this.center = this。$ store.state.city.location;

}、300);

setTimeout:指定した時間の後に実行されるようにコールバックを遅らせます

nextTickおよびsetTimeoutのコールバックの実行の前提条件は同じではありません

HL
8つのオリジナル記事を公開 Likes5 訪問40,000+

おすすめ

転載: blog.csdn.net/helenwei2017/article/details/90052952