如何使用轮询方法获取新边缘？

Question

我正在尝试进行无限滚动，只需增加第一个值即可正常工作。但是，我想在开始之前获取新的边缘。不强制抓取怎么办？

这是我的 RelayContainer，其中 firstLoad 和 afterFirst 引用具有不同参数的相同连接，使用别名。中继不查询之前的任何内容。我还从 graphql 服务器端强制将 hasNextPage 和 hasPreviousPage 设置为 true

中继如何决定是否从服务器获取新边

  constructor(props) {
    super(props);
    if (!props.viewer) {
      this.handleLogout();
      console.log('Access expired.');
      return;
    }

    const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => {
      return r1.cursor !== r2.cursor;
    }});

    this.state = {
      dataSource: ds.cloneWithRows(props.viewer.firstLoad.edges),
    };
  }

  componentWillMount() {
    // Set up to query for newly received messages
    const {edges} = this.props.viewer.firstLoad;
    this.props.relay.setVariables({
      last: edges.length,
      before: edges[edges.length - 1].cursor,
    });
  }

  componentDidMount() {
    this._interval = setInterval(() => {
      this.props.relay.setVariables({
        last: this.props.relay.variables.last + 10,
      });
    }, 2000);
  }

  componentWillReceiveProps(nextProps) {
    const {edges} = nextProps.viewer.afterFirst;
    if (edges) {
      this.setState({
        dataSource: this.state.dataSource.cloneWithRows(edges),
      });
    }
  }

Answer 1

我已经成功地解决了我的需求，方法是在 cursor/timestamp 之后创建一个 returns 新项目的新字段，并手动维护一个用于显示的数据数组，由来自 Relay 的数据填充。

一个关键要点是将变量与一些随机数据连接起来，这样 setVariables 就会向服务器而不是缓存发出请求。

startPolling() {
  this._timer = setTimeout(() => {
    this.props.relay.setVariables({
      lastCreatedAt: `${this._lastCreatedAt}:${new Date().getTime()}`,
    });
    this.startPolling();
  }, 5000);
}

如何使用轮询方法获取新边缘？

How to fetch for new edge using polling method?

ecmascript-6

relayjs