Reactjs / Graphql：在页面加载时停止执行graphql查询

Question

经过一些调试，我发现当页面加载时，React 正在执行以下查询：

export default graphql(Query, { 
    options: (props) => ({ 
        variables: { 
            start: props.start,
            end: props.end
        } 
    })         
)(Comp);

来自服务器的错误是“错误请求”，这似乎是因为 start 和 end 为空，并且它们被分配为 Float！当然，这些变量将是空的；用户尚未输入值。

当我在 UI 中输入值并单击提交时，它工作正常。我只需要帮助弄清楚如何防止在页面加载时执行此查询。并且仅在点击提交按钮时执行。

Answer 1

只需向qraphql hoc 提供skip 函数：

export default graphql(Query, {
  skip: ({ start, end }) => (!start || !end),
  options: ({ start, end }) => ({
    variables: { start, end }
  })
})(Comp);