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

Question

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

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

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

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

标签： reactjsreact-nativegraphqlreact-apollographql-js

Answer 1

只需为hoc提供一个skip函数：qraphql

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