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

【问题标题】：How to fetch for new edge using polling method?如何使用轮询方法获取新边缘？
【发布时间】：2016-05-09 20:32:39
【问题描述】：

我正在尝试进行无限滚动，只需增加第一个值即可。但是，我想获取开头之前的新边。如果不强制获取，我该如何做到这一点？

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

relay如何决定是否从服务器获取新的edge

  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),
      });
    }
  }

【问题讨论】：

标签： ecmascript-6 relayjs

【解决方案1】：

我已经成功地解决了我的要求，方法是创建一个在光标/时间戳之后返回新项目的新字段，并手动维护一个用于显示的数据数组，由来自 Relay 的数据填充。

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

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

【讨论】：