我对这个问题有点迷失,所以任何帮助将不胜感激!这是我想发送的查询:
query {
viewer{
search_places(lat: "40.7127", lng: "-74.0059", searchType:"all", searchTerm:"shopping"){
edges{
node{
id,
name,
lat,
lng
}
}
}
}
}
到目前为止一切顺利,当我在 GraphiQL 上尝试时,这个查询可以正常工作。此查询返回一个 PlaceConnection 对象。现在我尝试使用 Relay 在 React Native 上实现相同的功能:
class SearchPlacesRoute extends Route {
static paramDefinitions = {
lat : { required: true },
lng : { required: true },
searchType : { required: true },
searchTerm : { required: true }
}
static queries = {
search_places: () => Relay.QL`
query {
viewer{
search_places(lat: $lat, lng: $lng, searchType: $searchType, searchTerm: $searchTerm)
}
}
`
}
static routeName = 'SearchPlacesRoute'
}
class SearchPlacesComponent extends Component {
render () {
const places = this.props.search_places;
console.log(places);
for (var index = 0; index < places.length; index++) {
var element = places[index];
console.log(element);
}
return (
<View>
<Text>email: {places[0].name}</Text>
</View>
)
}
}
SearchPlacesComponent = Relay.createContainer(SearchPlacesComponent, {
fragments: {
search_places: () => Relay.QL`
fragment on PlaceConnection {
edges
{
node
{
id,
name,
lat,
lng
}
}
}
`
}
})
<RootContainer
Component={SearchPlacesComponent}
route={new SearchPlacesRoute({lat:"40.7127", lng: "-74.0059", searchType:"all",searchTerm: "shopping"})}
renderFetched={(data) => <SearchPlaces {...this.props} {...data} />}/>
但是当我尝试用此方法获取数据时,出现以下错误:
1. Objects must have selections (field 'search_places' returns PlaceConnection but has no selections)
_search_places40zPNn:search_places(lat:"40.7127",lng:"-7
^^^
2. Fragment F0 on PlaceConnection can't be spread inside Viewer
...F0
^^^
在我看来,该片段是作为单独的查询而不是选择发送的。知道为什么会发生这种情况或者我怎样才能避免这种行为?
编辑:
这是我的最终代码 - 希望它对某些人有帮助: https://gist.github.com/adamivancza/586c42ff8b30cdf70a30153944d6ace9
最佳答案
我认为问题是你的中继路由太深了。相反,将您的路由定义为仅查询 viewer
:
class SearchPlacesRoute extends Route {
static queries = {
viewer: () => Relay.QL`
query {
viewer
}
`
}
static routeName = 'SearchPlacesRoute'
}
然后,在组件内部将其定义为 fragment on viewer
,而不是 PlaceConnection
:
SearchPlacesComponent = Relay.createContainer(SearchPlacesComponent, {
initialVariables: { lat: "..." /* TODO */ },
fragments: {
viewer: () => Relay.QL`
fragment on viewer {
search_places(lat: $lat, lng: $lng, searchType: $searchType, searchTerm: $searchTerm) {
edges
{
node
{
id,
name,
lat,
lng
}
}
}
}
`
}
})
您需要移动变量( $lag
、 $lng
等)以定义为容器的一部分,而不是定义为路线的一部分。但我认为这应该可以解决你的问题。
关于reactjs - React Native graphql 查询与中继不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39013808/