时间戳

首页 > 解决方案 > 如何让我的 React Native Flatlist 重新加载领域数据更新？

react-native - 如何让我的 React Native Flatlist 重新加载领域数据更新？

问题描述

我正在使用从我的领域数据库中获取的数组来呈现任务的平面列表，但是当我更改数据库上的内容时，除非我离开页面，否则列表不会重新呈现。而且我不确定如何指示它，如果我一直在使用 redux，我会将其状态作为额外数据，但在这里我不确定该怎么做。

一些代码片段：

  async componentWillMount() {
try {
  let realm = await Realm.open({
    schema: [TaskSchema]
  });
  this.setState({ realm });
} catch (err) {
  console.log(err);
  console.log('we screwed boys');
}

如何在不离开页面的情况下更新数据库：

onDeleteClick = () => {
const realm = this.state.realm;
realm.write(() => {
  let completedTasks = this.state.realm.objects('Task').filtered('isComplete = true');
  realm.delete(completedTasks);
});

render() 中的平面列表声明：

let tasks = null;
if (this.state.realm) {
  tasks = this.state.realm.objects('Task');
}
return (
  <View style={styles.backgroundStyle}>
    <FlatList
      data={tasks}
      renderItem={this.renderTasks}
      keyExtractor={(item) => item.title}
    />

编辑：注意 - 它确实从数据库中正确删除了项目，列表只是不知道重新呈现，我不知道如何指示它

标签： react-nativerealmreact-native-flatlist

解决方案

您可以在删除任务后再次尝试设置领域对象，然后它应该重新渲染列表

 onDeleteClick = () => {
      const realm = this.state.realm;
      realm.write(() => {
        let completedTasks = this.state.realm
          .objects("Task")
          .filtered("isComplete = true");
        realm.delete(completedTasks);

        this.setState({
          realm, // set realm object using setState to re render the list.
        });
      });
    };

推荐阅读