Question

我正在从Realm成功生成FlatList而没有任何问题。但是，当我在添加新记录后关闭我的模态屏幕时，数据不会自动刷新（但是在“拉到刷新”之后它会执行）。有人可以帮我理解“HOW_TO_REFRESH”占位符中需要调用的内容吗？

FlatList生成：

export default class Accounts extends Component {

  static propTypes = {
    items: PropTypes.arrayOf(PropTypes.shape({
      accountid: PropTypes.string.isRequired,
      label: PropTypes.string.isRequired,
      balance: PropTypes.string.isRequired
    })),

    onDeleteItem: PropTypes.func,
    onRefreshItems: PropTypes.func,
    onSelectItem: PropTypes.func,
    refreshing: PropTypes.bool

  };

  static defaultProps = {
    onDeleteItem: (item) => {
      realm.write(() => {
        realm.delete(realm.objectForPrimaryKey('Account', item.accountid));
      })
    },
    onRefreshItems: () => { console.log('Refresh accounts'); },
    onSelectItem: (item) => { console.log('onSelectItem ', item); },
    refreshing: false
  }

  constructor(props) {
    super(props);

    this.state = ({
      activeRow: null
    });

  }

  renderItem(info, activeRow) {
    return (
        <AccountListItem item={info.item} onPress={() => this.props.onSelectItem(info.item)} />
    );
  }

  render() {

    const listSettings = {
      data: realm.objects('Account'),
      extraData: this.state.activeRow,
      keyExtractor: (item, index) => item.accountid,
      onRefresh: this.props.onRefreshItems,
      refreshing: this.props.refreshing,
      renderItem: (info) => this.renderItem(info, this.state.activeRow)
    };

    return (
      <Container style={styles.container}>
        <Header>
          <Left></Left>
          <Body>
            <Title>Accounts</Title>
          </Body>
          <Right>
            <Button transparent
              onPress={() => this.props.navigation.navigate('AddAccount', {name: 'Accounts', onGoBack: () => HOW_TO_REFRESH})} >
              <Icon name="ios-add" />
            </Button>
          </Right>
        </Header>
        <Container>
          <FlatList {...listSettings} />
        </Container>
      </Container>
    );
  }
}

在我的模态中调用以导航回来：

navigation.goBack();
navigation.state.params.onGoBack();

Answer 1

定义自己的方法

goBack= () => {
    //do code for refresh flatlist
}

在您导航时提及

this.props.navigation.navigate('AddAccount', {name: 'Accounts', onGoBack: () => this.goBack})

如何在模态回调时刷新FlatList

1 个答案: