拉取以刷新并设置状态不起作用 - 在本机做出反应

Question

反应本机应用程序

我正在实现拉动以刷新我的 Flatlist 道具“onRefresh”

，称为函数“刷新控制（）”，请参阅下面的代码。

在从 API 获取之前，我需要将状态“刷新”更改为 true。但它会引发最大的更新错误。

export default class NotificationScreen extends Component {

  constructor(props) {

   super(props)

   this.state = {

      refreshing: false 

    }

  }

.

.

.

.

.

  refreshControl() {

    const { refreshing } = this.state;

    this.setState({ refreshing : true )}.    // throws maximum update error

    return (

      <RefreshControl

        refreshing={refreshing}

        onRefresh={fetchNotifications.bind(this)}      //fetch from API only when refreshing is true

        colors={['#2B70AD']}

      />

    );

  };

}

否则，如何将我的状态设置为“刷新：true”???请帮忙!!!!

这就是它的修复方式。溶液：

refresh = async() => {

    this.setState({refreshing : true})

    try {

      const notifications = await fetchNotifications();

      this.setState({

        notifications,

        error: null,

        refreshing: false

      });

    } catch (error) {

      this.setState({

        notifications: [],

        error,

        refreshing: false

      });

    }

  }

  refreshControl() {

    const { refreshing } = this.state;

    return (

      <RefreshControl

        refreshing={refreshing}

        onRefresh={this.refresh}

        colors={['#2B70AD']}

      />

    );

  };

Answer 1

&nbsp; refreshFlatlist = () => {&nbsp; &nbsp; this.setState(&nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; refresh: true,&nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; () => this.getTodosHandler()&nbsp; &nbsp; );&nbsp; &nbsp; this.setState({&nbsp; &nbsp; &nbsp; refresh: false,&nbsp; &nbsp; });&nbsp; };这就是我刷新默认状态的方式，当然是错误的。待办事项处理程序始终持有当前待办事项。这是对本地存储在手机上的 SQLite 数据库的调用。现在我使用的简单列表刷新组件：&nbsp; &nbsp;<FlatList&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; refreshControl={&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <RefreshControl&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; refreshing={this.state.refresh}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; onRefresh={this.refreshFlatlist}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; extraData={this.state.refresh}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; data={this.state.toDoArray}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; keyExtractor={(item, index) => item.id.toString()}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; renderItem={({ item }) => ( ...&nbsp;看看它也许它会帮助你 - 这对我来说就像一个魅力;)

Answer 2

这可能不是问题，但我会把它放在这里给其他人（像我一样）试图调试：确保您的列表未放入滚动视图中！

Answer 3

这应该可以完美地工作。我认为您的代码中存在拼写错误。您正在使用 try 而不是 true。我认为这可能是错误的原因。