problems with accessing properties of an object in a request graphQl

Question

problems with accessing properties of an object in a request graphQl

Navigation

#1 by (1 votes)

0

Hi, I'm working on a reactive project with apollographQL and I'm having problems accessing the properties of the object that comes to me from the graphQl server with the mongodb database. Declare a test object in the same component and if I can access its properties, I really do not know what else to do. I put the code and logs of the console.

The question is: Why can not I access the properties of the object that comes in a data?

--- Component Profile

import React from 'react';

import gql from 'graphql-tag';
import { Query } from 'react-apollo';

const GET_CURRENT_USER = gql'
{
product (_id: "5b6ba3c9c7d76b0f5c7a2c36"){
  _id
  name
  description  
 }
 }
';
//Object for test
const test = {
name: "jhon",
second: "levi"
};

 const Profile = () =>
 <Query query={GET_CURRENT_USER}>
{({ data }) => {
    const { product } = data;
    console.log(product)
    console.log(test)
  return (
    <div>
      {product.name}
      {test.name}
    </div>
  );
}}

export default Profile;

Exit the console

javascript mongodb reactjs graphql

asked by user3821102 13.08.2018 в 20:04

source

1 answer

PHP Mail | Form emails do not arrive to my mail server Select the first 7 elements of an enum and display them in a Combobox using datasource

score 1 · Accepted Answer

Hello, I've already solved the problem. After analyzing the logs for several hours I realized that the first time the page loads the data that comes in response to the query of graphql comes undefined, and the second if it comes with data. Then in a post meeting you have to put the conditionals for the error and the loading to avoid rendering if the server delays in responding or there was a communication problem. Putting these instructions solved the problem

--- So I am the code

import React from 'react';

 import gql from 'graphql-tag';
 import { Query } from 'react-apollo';

 const GET_CURRENT_USER = gql'
 {
 product (_id: "5b6ba3c9c7d76b0f5c7a2c36"){
  _id
  name
  description 
  price 
 }
 }
 ';

 const Profile = () =>
 <Query query={GET_CURRENT_USER}>
 {({ loading, error, data }) => {
    const { product } = data;
    console.log(product)
   if (loading) return "Loading...";
   if (error) return 'Error! ${error.message}';
  return (
    <div>
      <p>El producto {product.name} es exquisito para un 
 {product.description} y tiene un valor de $ {product.price}</p>
    </div>
  );
 }}
</Query>
export default Profile;