Question

我正在学习React + Graphql + Relay ......我在这种情况下打了几个小时： - 我的组件看起来像这样

class Main extends React.Component {
  setLimit = (e) => {
    let newLimit = Number(e.target.value);
    this.props.relay.setVariables({ limit: newLimit });
  };
  render() {
    let content = this.props.store.linkConnection.edges.map(edge => {
      return <Link key={edge.node.id} link={edge.node} /> ;
    });
    return (
      <div>
        <h3>Links</h3>
        <select onChange={this.setLimit}>
          <option value="2" selected>2</option>
          <option value="4">4</option>
          <option value="6">6</option>
        </select>
        <ul>
          {content}
        </ul>
      </div>
    );
  };
}

Main = Relay.createContainer(Main, {
  initialVariables: {
    limit: 2
  },
  fragments: {
    store: () => Relay.QL`
      fragment on Store {
        linkConnection(first: $limit) {
          edges {
            node {
              id,
              ${Link.getFragment('link')}
            }
          }
        }
      }
    `
  }
});

你可以看到，有一个选择在那里正确触发setLimit处理程序...在setLimit内我有this.props.relay.setVariables ...虽然我没有得到任何错误查询不是重新呈现

我肯定会做一个菜鸟错误...只是不知道那是什么:) ...因为我是菜鸟:)）

感谢

Answer 1

所以我想我会自己回答：）

发生这种情况的主要原因是因为graphql正在返回 pageIngo.hasNextPage = false
显然我必须解决它，我发现了两件事：

resolve: (_, args) => connectionFromPromisedArray(  
 db.collection("links").find({}).limit(args.first).toArray(),
 args
)

我正在使用上面的代码查询
你可以看到我限制了我从db中获取的项目
更多的是，connectionFromPromisedArray函数是期望的提供整个数据集......不是部分响应
所以这实际上会导致graphql使hasNextPage变为false

希望这对任何人都有帮助:) ...我在这上面失去了一天以上：）

relay setVariables不会触发查询

1 个答案: