react-native - react-naitve,如何移动到平面列表中的某个项目
问题描述
我正在使用 react-native 制作自己的应用程序,我在做通知功能时遇到了一些困难。
我们有板子和评论,如果我们注意到有人写了评论,我想去平面列表评论中的评论(板子里可能有很多评论,所以如果我们只是去董事会而不关注通知评论,用户可能很难查找评论)。我在 flatlist 中搜索了一些滚动索引方法的示例。但我想直接去没有按钮或输入。我们在通知模型中有评论 ID。所以首先我认为,如果我们比较 flatlist 中的评论 ID 和设置状态,我们可以保存该评论的索引。但是 setState() 在 flatlist 中不起作用,因为错误“无法从不同组件的函数体内更新组件”。其次,我不知道我们将函数 scrollToIndex() 放在哪里,因为它可能会在渲染完成后移动。但我不知道那个状态。
如果您知道如何解决该问题,请帮助我!
(你可以认为instagram评论通知,如果我们点击它们,我们可以看到该评论,无论它们在哪里,因为它会自动移动到该评论
解决方案
getItemLayout = (data, index) => (
{ length: 50, offset: 50 * index, index }
)
getColor(index) {
const mod = index%3;
return COLORS[mod];
}
scrollToIndex = () => {
let randomIndex = Math.floor(Math.random(Date.now()) * this.props.data.length);
this.flatListRef.scrollToIndex({animated: true, index: randomIndex});
}
<FlatList
style={{ flex: 1 }}
ref={(ref) => { this.flatListRef = ref; }}
keyExtractor={item => item}
getItemLayout={this.getItemLayout}
initialScrollIndex={50}
initialNumToRender={2}
renderItem={({ item, index}) => (
<View style={{...style, backgroundColor: this.getColor(index)}}>
<Text>{item}</Text>
</View>
)}
{...this.props}
/>
这是使用滚动索引的简单代码。它可以移动到随机索引项目但我想移动某些项目做切换屏幕。在通知屏幕中,如果我们点击通知,我们需要移动有该评论的板。然后我们滚动到评论以显示用户。我们在通知模型中有董事会 ID 和评论 ID。搬到董事会并不难。但是滚动到评论对我来说很难。有什么解决办法??请
推荐阅读
- python - Google Stackdriver 日志记录:write_log_entries,数组里面有什么?
- reactjs - Openweather API JSON 数据
- jestjs - 测试报告为慢的开玩笑阈值
- python - 背景图像不显示在 Tkinter 程序上?
- postgresql - 如何从列中将当前日期附加到 AM/PM 时间并以 YYY-MM-DD HH:MM:SS.000 格式显示为 postgresql 中的时间
- jquery - 比较未排序的数组jquery并获取索引
- insert - 如何使用boto3将嵌套字典插入dynamodb?
- apache - Apache 使用 SetEnvIfExpr 允许 IP 范围
- python - 从交互 Selenium Python 中获取标题
- r - 某个方向内另一个数据集的最近点