2017-10-25 13 views
3

Relay Modern을 사용하여 구성 요소를 빌드하고 해당 변수에 인수를 전달하여 내 쿼리에서 GraphQL 인수로 사용할 수있게하려고합니다. 여기 변수 데이터를 createFragementContainer에 전달하는 방법

사용하여 코드 미안하다 :

class Test extends Component { 
    static propTypes = { 
     userId: PropTypes.string.isRequired 
    } 

    render =() => { 

     return (

      <p>User Id: {this.props.userId}</p> 
      <p>User name: {this.props.viewer.name} 
     ); 
    } 
} 

export default createFragmentContainer(
    Test, 
    graphql` 
     fragment Test_viewer on Viewer { 
      user(id: $userId) { <<=== The $userId must be the this.props.userId passed 
       id 
       name 
      } 
     } 
    ` 
); 

Variable \"$userId\" is not defined by operation \"UserQuery\"." 말 쿼리 GraphQL 서버 반환 오류를 발행. 상위 구성 요소에

내 쿼리 :

가 가

가 어떻게 작동 위의 코드를 만들 수 있습니다

const UserQuery = graphql` 

    query AdminQuery { 
    viewer { 
     ...Test_viewer 
    } 
    } 
` 
?

당신은 쿼리 수준에서 변수를 전달해야

답변

0

:

<QueryRenderer 
    query={UserQuery} 
    variables={{ 
    userId: 'USER_ID', 
    }} 
    // ... others props 
/> 
:

const UserQuery = graphql` 
    query AdminQuery($userId: ID!) { 
    viewer { 
     ...Test_viewer 
    } 
    } 
`; 

<QueryRenderer /> 요소에이 쿼리를 사용하여, 당신은 또한 소품으로 변수를 전달합니다