Joj*_*mas 4 scroll list react-native react-native-flatlist
我正在使用a flatList
从json文件渲染项目,我想在按下按钮时滚动到特定索引,我声明了按下按钮的功能,如下所示
goIndex = () => {
this.flatListRef.scrollToIndex({animated: true,index:5});
};
Run Code Online (Sandbox Code Playgroud)
尽管它没有显示任何错误,但是列表没有移动到指定的索引。
反应本机:0.55.4
FlatList的附加代码。
<View>
<FlatList
getItemLayout={(data, index) => { return {length: 33, index, offset: 33 * index} }}
ItemSeparatorComponent={ () => <View style={ { width:"100%", height: .7, backgroundColor: 'rgba( 52,52,52,1)' } } /> }
data={this.state.outverse}
renderItem={({item,index}) =>
<View style={styles2.flatview}>
<Text style={styles2.name}>{++index} {item} </Text>
</View>
}
/>
</View>
Run Code Online (Sandbox Code Playgroud)
尝试添加对FlatList
组件的引用,如下所示:
<View>
<FlatList
getItemLayout={(data, index) => { return {length: 33, index, offset: 33 * index} }}
ItemSeparatorComponent={ () => <View style={ { width:"100%", height: .7, backgroundColor: 'rgba( 52,52,52,1)' } } /> }
data={this.state.outverse}
ref={(ref) => { this.flatListRef = ref; }}
renderItem={({item,index}) =>
<View style={styles2.flatview}>
<Text style={styles2.name}>{++index} {item} </Text>
</View>
}
/>
</View>
Run Code Online (Sandbox Code Playgroud)
并在goIndex
功能上:
goIndex = () => {
this.refs.flatListRef.scrollToIndex({animated: true,index:5});
};
Run Code Online (Sandbox Code Playgroud)
归档时间: |
|
查看次数: |
7316 次 |
最近记录: |