Реагировать на мутацию GraphQL, возвращающую неверный ввод

Предыстория: я создаю приложение Shopify, используя React, NextJS и GraphQL. Функциональность заключается в добавлении дополнительного privateMetafield со значением для каждого выбранного продукта.

Проблема: я пытаюсь создать или обновить (если существует privateMetafield) с помощью Mutation с помощью React-Apollo. Я попытался запустить мутацию GraphQL в Insomnia (например, почтальон для GraphQL), и она работает. Но когда я добавляю его в свой код, я не получаю GraphQL для получения данных мутации. Вместо этого я получаю это сообщение об ошибке:

Unhandled Runtime Error
Error: GraphQL error: Variable $input of type PrivateMetafieldInput! was provided invalid value for privateMetafields (Field is not defined on PrivateMetafieldInput), namespace (Expected value to not be null), key (Expected value to not be null), valueInput (Expected value to not be null)

Insomnia Успешный тест GraphQL (каким он должен быть)  Тест GraphQL

edit-products.js

...
import gql from 'graphql-tag';
import { Mutation } from 'react-apollo';
...
const UPDATE_EMISSION = gql`
    mutation($input: PrivateMetafieldInput!) {
        privateMetafieldUpsert(input: $input) {
        privateMetafield {
            namespace
            key
            value
        }
        }
    }
`;
...
class EditEmission extends React.Component {
    state = {
        emission: '',
        id: '',
        showToast: false,
    };

    render() {
        const { name, emission, id } = this.state;
        return (
            <Mutation
                mutation={UPDATE_EMISSION}
            >
                {(handleSubmit, { error, data }) => {
                    const showError = error && (
                        <Banner status="critical">{error.message}</Banner>
                    );
                    const showToast = data && data.productUpdate && (
                        <Toast
                            content="Sucessfully updated"
                            onDismiss={() => this.setState({ showToast: false })}
                        />
                    );
                    return (
                        <Frame>
                            ...           <Form>
                                                        <TextField
                                                            prefix="kg"
                                                            value={emission}
                                                            onChange={this.handleChange('emission')}
                                                            label="Set New Co2 Emission"
                                                            type="emission"
                                                        />
                                                   ...
                                            <PageActions
                                                primaryAction={[
                                                    {
                                                        content: 'Save',
                                                        onAction: () => {
                                                            const item = store.get('item');
                                                            const id = item.id;
                                                            const emissionVariableInput = {
                                                                owner: id,
                                                                privateMetafields: [
                                                                    {
                                                                        namespace: "Emission Co2",
                                                                        key: "Co2",
                                                                        valueInput: {
                                                                            value: emission,
                                                                            valueType: "INTEGER"
                                                                        }
                                                                    }
                                                                ]
                                                            };
                                                            console.log(emissionVariableInput)
                                                            handleSubmit({
                                                                variables: { input: emissionVariableInput },
                                                            });
                                                        }
                                                    }
                                                ]}
                                                secondaryActions={[
                                                    {
                                                        content: 'Remove emission'
                                                    }
                                                ]}
                                            />
                                        </Form>
                                 ...
            </Mutation>
        );
    }

    handleChange = (field) => {
        return (value) => this.setState({ [field]: value });
    };
}

export default EditEmission;

Я получаю это в консоли, когда регистрирую selectionVariableInput, что выглядит правильно. Но почему данные не передаются должным образом в мутацию GraphQL и как это исправить?

введите описание изображения здесь

Я ожидаю, что мутация GraphQL будет успешной, и создаю / обновляю privateMetafield, принадлежащий продукту.

Заранее спасибо!


person 9minday    schedule 16.11.2020    source источник
comment
Я мог ошибаться, но должно ли это быть valueInput: $ input или input: $ valueInput?   -  person miguelsolano    schedule 16.11.2020
comment
@miguelsolano Спасибо за вопрос. Я попытался сдвинуть его, но вместо этого это привело к этой ошибке: valueInput не существует для PrivateMetafieldInput.   -  person 9minday    schedule 16.11.2020


Ответы (1)


У вас есть разные формы для ввода в ваших примерах. В Insomnia вы проходите:

   {
     owner: id,
     namespace: "Emission Co2",
     key: "Co2",
     valueInput: {
      value: emission,
      valueType: "INTEGER"
     }
   }

В коде ваш ввод выглядит так:

{
  owner: id,
  privateMetafields: [{
    namespace: "Emission Co2",
    key: "Co2",
    valueInput: {
     value: emission,
     valueType: "INTEGER"
    }
  }]
};
person Anastasiia Solop    schedule 16.11.2020