2017-10-25 6 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 />要素にこのクエリを使用して、あなたも小道具として変数を渡します

関連する問題