首頁猿問 angular里使用iscroll...

angular里使用iscroll時如何refresh?

JavaScript

慕桂英3389331 2019-03-14 08:22:02

Angular的項目，引入了iscroll，d.ts文件也寫好了，可以初始化沒問題，但是當組件更新時，需要調(diào)用IScroll.refresh()，根據(jù)以往用其他MVVM框架的經(jīng)驗，直接在視圖更新完畢的生命周期方法里調(diào)用IScroll.refresh()就行了：import * as IScroll from 'iscroll'export class Model_1{ scroll : IScroll scroll_option = {click:true} as IScroll.IScrollOptions constructor(){ } ngAfterViewInit(){ this.scroll = new IScroll(".scroll-wrapper",this.scroll_option) } ngAfterViewChecked(){ this.scroll.refresh() console.log(123) } //.... } 但此時問題出現(xiàn)了，iscroll加載后在滑動時會無限次觸發(fā)ngAfterViewChecked()(控制臺不斷打印出123)，導致視圖無法正確刷新，請問有遇到過這種問題嗎，是如何解決的呢？

查看完整描述

2 回答

胡說叔叔

TA貢獻1804條經(jīng)驗獲得超8個贊

與react,vue不同，angular的 ngAfterViewChecked()鉤子會在視圖發(fā)生任意重繪時觸發(fā)，并不是像其他框架觸發(fā)了render才有回調(diào)，解決方案是將重載iscroll的方法直接放置于ngAfterViewInit()中：

scrollRefresh(){

setTimeout(()=>{

this.scroll && this.scroll.refresh()

},130)

}

ngAfterViewInit(){

this.scroll = new IScroll(".scroll-wrapper", this.scroll_option)

this.scrollRefresh()

}

反對回復 2019-03-14

MM們

TA貢獻1886條經(jīng)驗獲得超2個贊

ngAfterViewChecked這個hook每次在檢測組件內(nèi)部自己的視圖(view)和子組件的視圖時都會調(diào)用，頻率很高的。官網(wǎng)也說明了:

Notice that Angular frequently calls AfterViewChecked(), often when there are no changes of interest. Write lean hook methods to avoid performance problems.

你說的那個庫沒有使用過，不過refresh這種刷新邏輯一般不會頻繁的觸發(fā)吧，那只需要在需要觸發(fā)的時候收到調(diào)用就可以了呀，沒有必要寫到ngAfterViewChecked 生命周期函數(shù)中吧

反對回復 2019-03-14