0

我需要轮询数据,直到response.Status === 'UpdatesComplete'. 我已经编写了这个节点 js API 函数,它基本上轮询数据 -

const getResults = async (location) => {
  try {
    const response = await poll(location);
    if (response.Status && response.Status === 'UpdatesComplete') {
      return response;
    }
    return await getResults(location);
  } catch (err) {
    throw err;
  }
};

app.get('/url', async (req, res) => {
  try {
    const results = await getResults(req.query);
    res.json(formatData(results));
  } catch (err) {
    res.status(500).send(err);
    console.error(err);
  }
});

我从 ComponentDidMount 生命周期方法中的 ReactJS 类组件调用此 API -

componentDidMount = () => {
    axios.get('url', {
      params: params
    })
    .then(response => {
      console.log(response.data, 'data');
      // setting the data on state
      this.setState({ filteredList: response.data });

    })
    .catch(err => {
      this.setState({ error: true });
    });
  };

这工作正常。但是由于 API 会返回数据,直到所有数据都被提取(在进行轮询之后),所以需要很长时间才能加载数据。我基本上是在寻找一旦获取数据就返回轮询数据以查看并同时轮询 API,直到所有数据都被获取。在这种情况下,数据将在每次轮询视图后不断更新,这将改善用户体验。提前致谢。

4

1 回答 1

0

您正在服务器端找到lazy loadingor解决方案。infinite scroll没有简单的方法可以做到这一点。

解决方案的基本思想是paginate轮询结果。IE。url?size=2&offset=0从客户端调用。然后在服务器端轮询前 2 个结果并返回。下次打电话url?size=2&offset=2等等。

于 2019-09-14T10:01:59.053 回答