這種長列表加載很多頁之後,然後跳轉至某個詳情頁面再返回到列表頁要到原來的位置
最重要的是加ref, ref={ node => handelRef(node) }, 還有就是要動態的設置initialListSize的值,首屏渲染的條數,不然默認只渲染20條,等你數據加載超過20條就不能滾動到指定位置哦~
<ListView
ref={ node => handelRef(node) }
initialListSize={ isFromRestDetail ? dataList.length : 10 }
dataSource={ dataSource }
renderHeader={ () => <TopCrawfishComponent datas={ props } showAddressP={ showAddress } /> }
renderFooter={ () => (<div className='crawfish-footer-listview' >
{ (rData.length >= limit || loadingStatus) ? statusText[loadingStatus] : '' }
</div>) }
renderRow={ res => { return <ResturantItem data={ res } handleScrollTop={ handleScrollTop } rData={ rData } pageIndex={ pageIndex } /> } }
className='resturant-item-container'
pageSize={ 10 }
useBodyScroll={ false }
onScroll={ forceCheck }
scrollRenderAheadDistance={ 500 }
scrollEventThrottle={ 200 }
onEndReached={ () => isCanGet && handleListView(10, pageIndex, fetchData, dataSource, isLoading, rData, currentTab) }
onEndReachedThreshold={ 1000 }
/>
然後這個scrollTo方法是ListView組件提供的
handelRef: node => {
// console.log('node', node)
// listview的滾動到指定位置
const oldScrollTop = getStore('oldScrollTop', 'session')
const isFromRestDetail = Number(getStore('isFromRestDetail', 'session'))
// 這個scrollTo方法是ListView組件提供的方法,滾動到指定位置
if (isFromRestDetail && node) node.scrollTo(0, oldScrollTop)
},