Javascript 使用react apollo和异步获取的变量调用graphql查询

我有一个

react

组件，它显示一张地图，上面有你附近的兴趣点

My HOC使用

react apollo

查询这些兴趣点，并将数据作为道具提供给纯UI组件

我试图将用户的位置从

navigator.geolocation

获取到graphql查询的变量中。但是由于navigator API是异步的，我似乎无法使它工作

看起来是这样的：

const getCurrentPosition=async（设置={}）=>
新承诺（（解决、拒绝）=>{
navigator.geolocation.getCurrentPosition（解析、拒绝、设置）；
}
);
const query=gql`
查询（$coordinates:[[Float]]）{
无论什么（过滤器：{coordinates:$coordinates}）{
_身份证
协调
}
}
`;
const withData=graphql（查询{
选项：异步（道具）=>{
const position=等待getCurrentPosition（）；
返回{
变量：{
坐标：[位置.坐标.纬度，位置.坐标.经度]，
},
};
},
道具：（{data:{loading，whatever，refetch，variables:{coordinates}}}）=>({
加载，
无论什么
协调，
重新蚀刻，
}),
});
常量列表=（{加载，不管什么，坐标，重新蚀刻}）=>{
如果（装载）{
返回null；
}
返回（/*地图显示*/）；
};
List.propTypes={
加载：React.PropTypes.bool.isRequired，
不管什么：React.PropTypes.array，
坐标：React.PropTypes.array，
refetch:React.PropTypes.func，
};
使用数据导出默认值（地图）；

坐标

在我的组件中始终为

null

当我记录事情时，似乎位置是计算出来的，但graphql查询和组件呈现在它之前

当我们获得用户位置时，不会调用查询，也不会重新呈现组件

---

可能吗？我做错了什么吗？

我会事先进行异步调用，并通过道具将其注入，然后如果位置还不在这里，则使用跳过查询

---

可能是使用了recompose/withProps等？

最终执行了一个HOC，异步检索当前位置并在稍后更新其状态。我将显示一个加载程序，直到我们得到当前位置，然后显示初始化到右中心的地图。你能显示代码，让我看看它是如何工作的吗？