RelayTest.tsx 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. import * as React from 'react';
  2. import {graphql, QueryRenderer} from 'react-relay';
  3. import environment from '../graphqlEnvironment';
  4. class RelayTest extends React.Component {
  5. render() {
  6. //const {id} = this.props.match.params;
  7. return (
  8. <QueryRenderer
  9. environment={environment}
  10. query={graphql`
  11. query RelayTestQuery($pokemonID: ID!) {
  12. node(id: $pokemonID) {
  13. id
  14. ...Show_pokemon
  15. }
  16. }
  17. `}
  18. render={({error, props}) => {
  19. if (error) {
  20. return <div>Error!</div>;
  21. }
  22. if (!props) {
  23. return <div>Loading...</div>;
  24. }
  25. return (
  26. <ul>
  27. <li>ID: {props.node.id}</li>
  28. <li>IID: {props.node.iid}</li>
  29. <li>nickname: {props.node.nickname}</li>
  30. <li>pokedexNumber: {props.node.pokedexNumber}</li>
  31. <li>createdAt: {props.node.createdAt}</li>
  32. <li>updatedAt: {props.node.updatedAt}</li>
  33. </ul>
  34. );
  35. }}
  36. variables={{pokemonID: 'UG9rZW1vbi0yMDE='}}
  37. />
  38. );
  39. }
  40. }
  41. export default RelayTest;