Closed q3e closed 6 years ago
I dont know how to form queries with dynamic variables in graphql apollo.
import React, { Component } from 'react'; import { Text, FlatList } from 'react-native'; import { graphql } from 'react-apollo'; import gql from 'graphql-tag'; import { SEARCH_QUERY } from './Home' // The data prop, which is provided by the wrapper below contains, // a `loading` key while the query is in flight and posts when ready const ReposList = ({ data: { loading, error, search }, searchQuery}) => { if(!error){ if(loading){ return <Text>fetching posts... </Text> }else { const responseData = search.edges console.log('You are searching for', searchQuery) // did we need to pass props :( return ( <FlatList data={responseData} renderItem={({item}) => <Text>{item.node.nameWithOwner}</Text>} /> ) } }else <Text> Error Fetching posts</Text> } // this doesnt work const searchRepos = gql` query searchRepos($type: searchType!, $query: String!) { search(type: REPOSITORY, query: $query, first: 100) { edges { node { ... on Repository { nameWithOwner owner { login } } } } } } ` // This works and returns search results!!! // const searchRepos = gql`{ // search(type: REPOSITORY, query: "react", first: 100) { // edges { // node { // ... on Repository { // nameWithOwner // owner { // login // } // } // } // } // } // } // ` // The `graphql` wrapper executes a GraphQL query and makes the results // available on the `data` prop of the wrapped component (ReposList here) export default graphql(searchRepos, { options: { variables: { query: SEARCH_QUERY }, notifyOnNetworkStatusChange: true } } )(ReposList);
data from this component is undefined.
http://dev.apollodata.com/react/queries.html#graphql-options
fixed by https://github.com/bnovf/react-native-github-graphql-app/commit/f1b6fa352aa001995f6fdc9a24cd43733bd8dd47 https://github.com/bnovf/react-native-github-graphql-app/commit/084b37b67533122fb71128e4fddb92989d16364b
I dont know how to form queries with dynamic variables in graphql apollo.
data from this component is undefined.
http://dev.apollodata.com/react/queries.html#graphql-options