React Apollo Graphql Mutation в компоненте класса - PullRequest
Новая
       21

React Apollo Graphql Mutation в компоненте класса

0 голосов
/ 06 мая 2020

У меня есть мутация, которую я хочу выполнить одним нажатием кнопки. Приведенная ниже мутация отлично работает при тестировании через мою игровую площадку graphql: 

mutation {
  updateUser(userData: {
    profileDetails: {
      firstName: "Andy"
    }
  }) {
    success,
  }
}

Однако я не уверен, как заставить эту работу работать изнутри моего компонента на основе класса приложения реакции. Вот что я пробовал до сих пор. 

import React from 'react';
import { gql } from 'apollo-boost';
import { Mutation } from 'react-apollo';

// SOMETHING WRONG HERE?
const UPDATE_USER = gql`
  mutation UpdateUser($userData: DataInput) {
    updateUser(userData: $userData)
  }
`;

export default class Main extends React.Component {
  render() {
    <Mutation mutation={UPDATE_USER}>
      {(updateUser, { loading, error, data }) => {
        <div>
          <button
            // OR SOMETHING WRONG HERE?
            onClick={() =>
              updateUser({
                variables: {
                  userData: {
                    profileDetails: {
                      firstName: "Andy",
                    },
                  },
                },
              })
            }
          >
            Update Details
          </button>
        </div>;
      }}
    </Mutation>;
  }
}

К сожалению, это не работает. Я знаю, что что-то не так в коде, просто не могу понять, что именно.

...